CHAPTER 20 ■ ALERTS
Inline Alert
HTML
<h1>Inline Alert</h1><p>An inline alert slips right into the flow of text.
As such it can be broken across lines.<span class="alert tip">
<strong class="heading">Alert: </strong>
<em class="content">brief message. </em>
</span>You can keep the alert's message brief and you can use
<code>white-space:nowrap</code> to prevent it from breaking across lines.
It is also important to make the line height large enough to prevent the
alert's padding and border from overlapping neighboring lines. </p>CSS
*.alert { white-space:nowrap; line-height:2.3em;
margin:0 20px; padding:8px 20px 5px 20px;
border-top:1px solid black; border-bottom:1px solid black;
background-color:gold; }*.alert *.heading { font-weight:bold; font-size:1.3em; }*.alert *.content { letter-spacing:1.5px; font-style:normal; }*.alert.tip *.heading { text-transform:uppercase; }