Flex Direction
Controls the direction of flex elements.
| Class | Property |
|---|---|
| fd-c | flex-direction: column; |
| fd-cr | flex-direction: column-reverse; |
| fd-r | flex-direction: row; |
| fd-rr | flex-direction: row-reverse; |
Using responsive modifiers
Using responsive breakpoints like sm:fd-*,
md:fd-*, lg:fd-*, and xxl:fd-* allows targeting specific utilities in
different viewports.
<div class="fd-c md:fd-r ..."></div>Using hover modifiers
Using :hover modifiers such as h:fd-* allows
you to override elements and change their values when hovering over them.
<div class="fd-c h:fd-r ..."></div>