JSFiddle - React, Tailwind, and code Playground

HTML

<div class="header">
    <div class="index">
        <div class="left">left</div>
        <div class="right">right</div>
    </div>
</div>
<div class="content">
    <div class="index">
        Если сжать окно до 500 пикселей, и воспользоваться горизонтальной прокруткой, то блока "right" не будет видно.
    </div>
</div>

CSS

.header {
    position: fixed;
    background: orange;
    width: 100%;
}
.left {
    float: left;
}
.right {
    float: right;
}
.index {
    max-width: 1000px;
    min-width: 700px;
}
.content {
    padding-top: 70px;
}