center-absolute (_base.scscs)

Tipo: Mixin

Versión: 2.x.x

Centra un elemento de forma absoluta usando position y transform.

Internamente aplica position: absolute, ubica el elemento en 50% / 50% y luego corrige su propio tamaño con translate(-50%, -50%).

Interface

@mixin center-absolute;

Ejemplo

Nota: El elemento con position: absolute se centra respecto de su ancestro posicionado más cercano, es decir, el primer contenedor padre con una propiedad position distinta de static como relative, absolute, fixed o sticky. Si no existe uno, el cálculo se hace respecto del contenedor inicial de la página.


            

            
<div class="center_absolute_container">
    <div class="center_absolute_example box"></div>
</div>