JSFiddle - React, Tailwind, and code Playground

HTML

<div class="signboard">
    <div class="anonc">
        <h1>БЛОК 1</h1>
        <p>Поздравляем наших читателей с Днейм Знаний. Пользуясь случаем, напоминаем, что глаголы,отвечающие на вопрос "что делать?", оканчиваются на -ться,а отвечающие на вопросы "что делать/делают?" - -тся
        </p>
    </div>
    <div class="rek">
        <div class="rek_block">
            <h1>БЛОК 2</h1>
        </div>
        <form action="index.php" method="post">
            <span>Поиск по сайту</span>
            <div class="input">
                <img src="image/poisk.png" alt="" />
                <input type="text" />
            </div>
        </form>
    </div>
</div>

CSS

.signboard{
    min-width:500px;
    margin:40px;
    position:relative;
    background: #ddd;
    overflow:hidden;
    }
.anonc{
    float:left;
    width:40%;
    height: auto;
    padding:20px 20px 30px 20px;
    background: #aaa;
    border: 1px solid #DBDBDB;
}
.rek{
    width: 48%;
    top:0;
    right:0;
    bottom:0;
    position:absolute;
    background:orange;
    }
.rek_block{
    background:yellow;
    position: relative;
    width: auto;
    height:100px;
    border: 1px solid #DBDBDB;
    text-align: center;
    margin-bottom:20px;
}
.rek form {
    background:red;
    position: absolute;
    bottom:0;
    width:100%;
}
.rek form span{
    float:left;
}