mirror of
https://github.com/twbs/bootstrap.git
synced 2025-01-17 09:52:29 +01:00
Dump the type margin overrides in alerts for utils, document that particular example, sidesteps part of #18884
This commit is contained in:
parent
2ac922c78f
commit
b4a2b99395
@ -49,6 +49,19 @@ Use the `.alert-link` utility class to quickly provide matching colored links wi
|
||||
</div>
|
||||
{% endexample %}
|
||||
|
||||
### Additional content
|
||||
|
||||
Alerts can also contain additional HTML elements like headings and paragraphs.
|
||||
|
||||
{% example html %}
|
||||
<div class="alert alert-success" role="alert">
|
||||
<h4 class="alert-heading">Well done!</h4>
|
||||
<p>Aww yeah, you successfully read this important alert message. This example text is going to run a bit longer so that you can see how spacing within an alert works with this kind of content.</p>
|
||||
<p class="m-b-0">Whenever you need to, be sure to use a margin utilities to keep things nice and tidy.</p>
|
||||
</div>
|
||||
{% endexample %}
|
||||
|
||||
|
||||
### Dismissing
|
||||
|
||||
Using the alert JavaScript plugin, it's possible to dismiss any alert inline. Here's how:
|
||||
|
@ -7,15 +7,6 @@
|
||||
margin-bottom: $spacer-y;
|
||||
border: $alert-border-width solid transparent;
|
||||
@include border-radius($alert-border-radius);
|
||||
|
||||
// Improve alignment and spacing of inner content
|
||||
> p,
|
||||
> ul {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
> p + p {
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
// Headings for larger alerts
|
||||
|
Loading…
x
Reference in New Issue
Block a user