HTML and CSS Reference
In-Depth Information
Figure 3.23: Paragraphs embedded as
inline-block
elements
HTML elements with a
display
value of
run-in
are another form of hybrid
element. his setting provides a means to mash one element into the begin-
ning of the following block element. his is a useful technique when you run
out of ideas on what to do diferently with your headings. Example 3.24 shows
how a heading can be made to low into the following element as if it were an
inline part of that element.
Example 3.24: The level-four heading is incorporated into the following
paragraph
5
<!DOCTYPE html>
<html>
<head>
<title>Example 3.24</title>
<style type="text/css">
body { border: thin solid; padding: 0 1em; }
h4.smerge { display: run-in;
padding-right: 0.5em;
font: large sans-serif; }
</style>
</head>
<body>
<h4 class="smerge">
Market Smarts:
</h4>
<p>
The question is not whether the passerby wants to buy
your lemonade but whether he is thirsty.
</p>
</body>
</html>
5. his is using the Safari browser. At the time this was written, the
display
property value of
run-in
was
not recognized by Firefox's HTML parser.