Bootstrap class: .list-inline
<ul class="list-inline">
<li class="list-inline-item">Lorem ipsum</li>
<li class="list-inline-item">Phasellus iaculis</li>
<li class="list-inline-item">Nulla volutpat</li>
</ul>Preview
- Lorem ipsum
- Phasellus iaculis
- Nulla volutpat
Check .list-inline in a real project
Click one of the examples listed below to open the Shuffle Visual Editor with the UI library that uses the selected component.
Tips 💡
You don't need to remember all CSS classes. Just use the Bootstrap Editor instead.
Sass source
/* _type.scss:89 */
.list-inline {
@include list-unstyled;
}Uses variables
Code copied to the clipboard.
Copying failed
/* _type.scss:89 */
More in Bootstrap Typography
- display-# (1-4)
- blockquote
- blockquote-footer
- blockquote-reverse
- list-unstyled
- dl-horizontal
- lead
- display-1
- display-2
- display-3
- display-4
- display-5
- display-6
- font-monospace
- fs-1
- fs-2
- fs-3
- fs-4
- fs-5
- fs-6
- fs-lg-1
- fs-md-1
- fs-sm-1
- fs-4
- fst-italic
- fst-normal
- fw-bolder
- fw-normal
- fw-light
- fw-lighter
- h1
- h2
- h3
- h4
- h5
- h6
- lh-1
- lh-base
- lh-lg
- lh-sm
- text-break
- text-center
- text-decoration-line-through
- text-decoration-underline
- text-start
- text-end
- text-lg-center
- text-lg-start
- text-lg-end
- text-md-center
- text-md-start
- text-md-end
- text-reset
- text-xl-start
- text-xl-end
- text-sm-center
- text-sm-start
- text-sm-end
- text-wrap
- text-xl-start
- text-xl-end
- text-xl-center
- text-xl-start
- text-xl-end
- text-xxl-center
- text-xxl-start
- text-xxl-end
