Posición

Utilice estas utilidades abreviadas para configurar rápidamente la posición de un elemento.

Valores comunes

Las clases de posicionamiento rápido están disponibles, aunque no responden.

<div class="position-static">...</div>
<div class="position-relative">...</div>
<div class="position-absolute">...</div>
<div class="position-fixed">...</div>
<div class="position-sticky">...</div>

Parte superior fija

Coloque un elemento en la parte superior de la ventana gráfica, de borde a borde. Asegúrese de comprender las ramificaciones de la posición fija en su proyecto; es posible que deba agregar CSS adicional.

<div class="fixed-top">...</div>

fondo fijo

Coloque un elemento en la parte inferior de la ventana gráfica, de borde a borde. Asegúrese de comprender las ramificaciones de la posición fija en su proyecto; es posible que deba agregar CSS adicional.

<div class="fixed-bottom">...</div>

parte superior pegajosa

Coloque un elemento en la parte superior de la ventana gráfica, de borde a borde, pero solo después de pasarlo. La .sticky-toputilidad utiliza CSS position: sticky, que no es totalmente compatible con todos los navegadores.

IE11 e IE10 se renderizarán position: stickycomo position: relative. Como tal, envolvemos los estilos en una @supportsconsulta, limitando la permanencia solo a los navegadores que pueden representarlo correctamente.

<div class="sticky-top">...</div>