JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container-fluid">
    <div class="navbar-fixed-top">
        <span>SearchArea </span>
    </div>
    <div>
        <span>ThingsToAlign</span>
    </div>
</div>

CSS

body { margin: 0; }

.container-fluid {
    height: 500px;
    background-color: yellow;
    position: relative;
}

.navbar-fixed-top {
    position: fixed;
    top: 0;
    border: 1px solid red; /* for demo */
    background-color: aqua;
    height: 200px; /* for demo */
    width: 100%;
}

.container-fluid > div:last-child {
    height: 100px;
    background-color: red;
    position: absolute;
    bottom: 0;
    width: 100%;
}