<p>Build on any alert by adding an optional <code>.alert-dismissable</code> and close button.</p>
<div class="bs-example">
<div class="alert alert-dismissable">
- <button type="button" class="close" data-dismiss="alert">×</button>
+ <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<strong>Warning!</strong> Best check yo self, you're not looking too good.
</div>
</div>
{% highlight html %}
<div class="alert alert-dismissable">
- <button type="button" class="close" data-dismiss="alert">×</button>
+ <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<strong>Warning!</strong> Best check yo self, you're not looking too good.
</div>
{% endhighlight %}
<h3>Close icon</h3>
<p>Use the generic close icon for dismissing content like modals and alerts.</p>
<div class="bs-example">
- <p><button type="button" class="close">×</button></p>
+ <p><button type="button" class="close" aria-hidden="true">×</button></p>
</div>
{% highlight html %}
-<button type="button" class="close">×</button>
+<button type="button" class="close" aria-hidden="true">×</button>
{% endhighlight %}
<h3>.pull-left</h3>
<p>Add dismiss functionality to all alert messages with this plugin.</p>
<div class="bs-example">
<div class="alert fade in">
- <button type="button" class="close" data-dismiss="alert">×</button>
+ <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<strong>Holy guacamole!</strong> Best check yo self, you're not looking too good.
</div>
</div><!-- /example -->
<div class="bs-example">
<div class="alert alert-block alert-error fade in">
- <button type="button" class="close" data-dismiss="alert">×</button>
+ <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<h4>Oh snap! You got an error!</h4>
<p>Change this and that and try again. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum.</p>
<p>
<h3>Markup</h3>
<p>Just add <code>data-dismiss="alert"</code> to your close button to automatically give an alert close functionality.</p>
- {% highlight html %}<a class="close" data-dismiss="alert" href="#">×</a>{% endhighlight %}
+ {% highlight html %}<a class="close" data-dismiss="alert" href="#" aria-hidden="true">×</a>{% endhighlight %}
<h3>Methods</h3>