Divider
Create dividers to separate content and apply different styles to them.
Usage
You can use the .uk-hr
class to an <hr/>
or <div>
element to illustrate a separation of different content parts on your pages. The Divider component allows you to add different styles to these dividers.
-
-
Something's not working? Feel free to report an issue or edit this snippet .
<hr class="uk-hr" /> -
Something's not working? Feel free to report an issue or edit this snippet .
<hr className="uk-hr" />
Divider icon
Add the .uk-divider-icon
class to a <hr>
or <div>
element to create a divider with some decoration, like an icon.
-
-
Something's not working? Feel free to report an issue or edit this snippet .
<hr class="uk-divider-icon" /> -
Something's not working? Feel free to report an issue or edit this snippet .
<hr className="uk-divider-icon" />
Divider small
Add the .uk-divider-sm
class to a <hr>
or <div>
element to create a smaller divider.
-
-
Something's not working? Feel free to report an issue or edit this snippet .
<hr class="uk-divider-sm" /> -
Something's not working? Feel free to report an issue or edit this snippet .
<hr className="uk-divider-sm" />
Divider vertical
Add the .uk-divider-vertical
class to a <hr>
or <div>
element to create a vertical divider.
-
-
Something's not working? Feel free to report an issue or edit this snippet .
<hr class="uk-divider-vertical" /> -
Something's not working? Feel free to report an issue or edit this snippet .
<hr className="uk-divider-vertical" />
- On This Page
- Usage
- Divider icon
- Divider small
- Divider vertical