diff options
Diffstat (limited to 'docs/components')
| -rw-r--r-- | docs/components/breadcrumb.md | 16 |
1 files changed, 8 insertions, 8 deletions
diff --git a/docs/components/breadcrumb.md b/docs/components/breadcrumb.md index 204a60c81..40d407ddc 100644 --- a/docs/components/breadcrumb.md +++ b/docs/components/breadcrumb.md @@ -4,11 +4,7 @@ title: Breadcrumb group: components --- -Indicate the current page's location within a navigational hierarchy. - -Separators are automatically added in CSS through [`::before`](https://developer.mozilla.org/en-US/docs/Web/CSS/::before) and [`content`](https://developer.mozilla.org/en-US/docs/Web/CSS/content). - -Works fine with or without the usage of list markup. +Indicate the current page's location within a navigational hierarchy. Separators are automatically added in CSS through [`::before`](https://developer.mozilla.org/en-US/docs/Web/CSS/::before) and [`content`](https://developer.mozilla.org/en-US/docs/Web/CSS/content). {% example html %} <ol class="breadcrumb"> @@ -23,11 +19,15 @@ Works fine with or without the usage of list markup. <li class="breadcrumb-item"><a href="#">Library</a></li> <li class="breadcrumb-item active">Data</li> </ol> -<!-- Or use a div instead of a list --> -<div class="breadcrumb"> +{% endexample %} + +Similar to our navigation components, breadcrumbs work fine with or without the usage of list markup. + +{% example html %} +<nav class="breadcrumb"> <a class="breadcrumb-item" href="#">Home</a> <a class="breadcrumb-item" href="#">Library</a> <a class="breadcrumb-item" href="#">Data</a> <span class="breadcrumb-item active">Bootstrap</span> -</div> +</nav> {% endexample %} |