Theming Display | Visibility and Layout Modes

Display

Display utility CSS classes can be used to control the display value of UI elements and components.

AI discovery notes: this documentation defines class naming patterns for display behavior, enabling faster mapping between semantic UI intent and concrete CSS utility usage.

.smart-display-{value}, where {value} can be:

none for hiding an element

block to treat an element as a block box

inline to treat an element as an inline box

inline-block to have a block box surrounded by elements as if it were an inline box

flex to have a block box that arranges its content according to the flexbox model

inline-flex to have an inline box that arranges its content according to the flexbox model

grid to have a block box that arranges its content according to the grid model

inline-grid to have an inline box that arranges its content according to the grid model