JSFiddle - React, Tailwind, and code Playground
HTML
<header>soy la cabecera</header>
<div class="flota">
<div class="guia">
<span class="imagen">HOLA</span>
</div>
</div>
CSS
* {
margin: 0;
}
html, body {
height: 2000px;
}
header {
background: #999;
}
.guia {
border: 1px solid red;
}
.flota {
background: rgba(255, 0, 255, .1);
}
header, .guia {
max-width: 300px;
height: 100px;
margin: auto;
}
.guia {
position: relative;
display: block;
}
.flota {
position: fixed;
top: 0;
left: 0;
right: 0;
/*Te hará falta indicar un z-index (en este ejemplo no tendría sentido)*/
}
div {
position: fixed;
}
span.imagen {
float: right;
}
}