VueSimpleDisplay
Quickly toggle the display value of components with display utilities. The display helpers allow you to control the display of content.
Displays
The helper classes applies display helper property to an element.
u-display-{value}- appliesdisplay css property
The value property is one of:
noneinheritblockflexinlineinline-blockinline-flexlist-itemtabletable-rowtable-cell
Alignments
The alignmnent helpers allows you to control the alignment of content (text-align property).
Available Classes:
| Class | Description |
|---|---|
u-ta-left | Align Left |
u-ta-center | Align Center |
u-ta-right | Align Right |
u-ta-justify | Align Justify |
u-ta-inherit | Inherit Align |
Vertical Alignments
The alignmnent helpers allows you to control the vertical alignment of content (vertical-align property).
Available Classes:
u-va-topu-ta-text-topu-va-superu-va-middleu-va-baselineu-va-subu-va-text-bottomu-va-bottomu-va-inherit
Visibility
Available visibility helper classes:
| Class | Description |
|---|---|
u-visibility-visible | Hidden Text |
u-visibility-hidden | Visible Text |
u-visibility-screenreader | Focusabled text with hidden screenreader text |