Styling: Labels

Oracle® JavaScript Extension Toolkit (JET)
17.0.0

F92240-01

Description

Style classes handling the Labels display


.oj-label-for-non-control
Place on a label element along with oj-label-nocomp when you want to style it like a JET oj-label but the label isn't associated with a JET form control, such as when you have a label for some plain text.
Deprecated:
Since Description
9.0.0 This class is not supported in the Redwood nor the Alta theme, and will be removed from the JET API in a future release. Use a JET oj-label component with its label-id attribute instead.
Example
<label class="oj-label-nocomp oj-label-for-non-control">
     <!-- label text for some plain text -->
</label>
.oj-label-inline
Place on a label element along with oj-label-nocomp to inline the label with the sibling DOM element when you don't want to use the responsive design classes (e.g., oj-md-labels-inline).
Deprecated:
Since Description
9.0.0 This class is not supported in the Redwood theme, and will be removed from the JET API in a future release. Use a JET oj-label-value with label-edge='start' instead.
Example
<label class="oj-label-nocomp oj-label-inline">
   <!-- label text -->
</label>
.oj-label-inline-top
Place on a label element along with oj-label-nocomp and oj-label-inline selectors to inline the label with the sibling DOM element and have zero margin-top.
Deprecated:
Since Description
9.0.0 This class is not supported in the Redwood theme, and will be removed from the JET API in a future release. Use a JET oj-label-value with label-edge='start' instead.
Example
<label class="oj-label-nocomp oj-label-inline oj-label-inline-top">
   <!-- label text -->
</label>
.oj-label-nocomp
Place on a label element when it isn't a JET component but you want it to be styled like a JET oj-label.
Deprecated:
Since Description
9.0.0 This class is not supported in the Redwood theme, and will be removed from the JET API in a future release. Use a JET oj-label component with its label-id attribute instead.
Example
<label class="oj-label-nocomp">
   <!-- label text -->
</label>
.oj-label-nowrap
Place on a label element along with oj-label-nocomp to have it not wrap when you don't want to use the responsive design classes (e.g., oj-md-labels-nowrap or oj-md-label-nowrap).
Example
<label class="oj-label-nocomp oj-label-nowrap">
   <!-- label text -->
</label>