</div>
</div>
<a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
- <span class="icon-prev"></span>
+ <span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
- <span class="icon-next"></span>
+ <span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div><!-- /example -->
<!-- Controls -->
<a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
- <span class="icon-prev"></span>
+ <span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
- <span class="icon-next"></span>
+ <span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
{% endhighlight %}
-<div class="bs-callout bs-callout-info">
- <h4>Glyphicon Alternative</h4>
- <p>With <a href="{{ page.base_url }}components/#glyphicons">Glyphicons</a> available, you may choose to style the left and right toggle buttons with <code>.glyphicon .glyphicon-chevron-left</code> and <code>.glyphicon .glyphicon-chevron-right</code>.</p>
-</div>
<h3>Optional captions</h3>
<p>Add captions to your slides easily with the <code>.carousel-caption</code> element within any <code>.item</code>. Place just about any optional HTML within there and it will be automatically aligned and formatted.</p>
</div>
</div>
<a class="left carousel-control" href="#carousel-example-captions" data-slide="prev">
- <span class="icon-prev"></span>
+ <span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="right carousel-control" href="#carousel-example-captions" data-slide="next">
- <span class="icon-next"></span>
+ <span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div><!-- /example -->