diff options
Diffstat (limited to 'docs/components/carousel.md')
| -rw-r--r-- | docs/components/carousel.md | 29 |
1 files changed, 16 insertions, 13 deletions
diff --git a/docs/components/carousel.md b/docs/components/carousel.md index 36b302579..138358f37 100644 --- a/docs/components/carousel.md +++ b/docs/components/carousel.md @@ -36,21 +36,23 @@ A slideshow component for cycling through elements—images or slides of text— </div> {% endexample %} -<div class="bs-callout bs-callout-warning" id="callout-carousel-transitions"> - <h4>Transition animations not supported in Internet Explorer 9</h4> - <p>Bootstrap exclusively uses CSS3 for its animations, but Internet Explorer 9 doesn't support the necessary CSS properties. Thus, there are no slide transition animations when using that browser. We have intentionally decided not to include jQuery-based fallbacks for the transitions.</p> -</div> +{% callout warning %} +#### Transition animations not supported in Internet Explorer 9 -<div class="bs-callout bs-callout-warning" id="callout-carousel-active"> - <h4>Initial active element required</h4> - <p>The <code>.active</code> class needs to be added to one of the slides. Otherwise, the carousel will not be visible.</p> -</div> +Bootstrap exclusively uses CSS3 for its animations, but Internet Explorer 9 doesn't support the necessary CSS properties. Thus, there are no slide transition animations when using that browser. We have intentionally decided not to include jQuery-based fallbacks for the transitions. +{% endcallout %} + +{% callout warning %} +#### Initial active element required + +The `.active` class needs to be added to one of the slides. Otherwise, the carousel will not be visible. +{% endcallout %} ### Optional captions Add captions to your slides easily with the `.carousel-caption` element within any `.carousel-item`. Place just about any optional HTML within there and it will be automatically aligned and formatted. -<div class="bs-example"> +<div class="bd-example"> <div id="carousel-example-captions" class="carousel slide" data-ride="carousel"> <ol class="carousel-indicators"> <li data-target="#carousel-example-captions" data-slide-to="0" class="active"></li> @@ -101,10 +103,11 @@ Add captions to your slides easily with the `.carousel-caption` element within a </div> {% endhighlight %} -<div class="bs-callout bs-callout-danger"> - <h4>Accessibility issue</h4> - <p>The carousel component is generally not compliant with accessibility standards. If you need to be compliant, please consider other options for presenting your content.</p> -</div> +{% callout danger %} +#### Accessibility issue + +The carousel component is generally not compliant with accessibility standards. If you need to be compliant, please consider other options for presenting your content. +{% endcallout %} ## Usage |