Mixin vendor de SISASS para la propiedad flex-direction.
Define la dirección principal en la que se distribuyen los elementos dentro de un contenedor flex. Aplica el prefijo histórico -webkit- y después agrega la propiedad estándar.
@mixin flex-direction($br: row);| Parámetro | Tipo | Default | Descripción |
|---|---|---|---|
| br | Keyword | String | row | Define el valor que se asignará a la propiedad flex-direction. |
En este ejemplo, ambos contenedores usan flex con los mismos elementos. El primero mantiene la dirección horizontal con row. El segundo aplica column, por lo que apila los elementos de arriba hacia abajo y hace evidente la diferencia.
<div class="flex_direction_example">
<h3 class="subtitle">flex-direction: row</h3>
<div class="box_group row"><span class="box">A</span><span class="box">B</span><span class="box">C</span></div>
<h3 class="subtitle">flex-direction: column</h3>
<div class="box_group column"><span class="box">A</span><span class="box">B</span><span class="box">C</span></div>
</div>