HTM5/Web Applications 1.0 proposes the dialog element.
It will add something on the semantic level (the
). But on the presentational level (CSS), this is how I’m doing for more than one year:dt is the name of the person
CSS
dl.run-in, dl.run-in dd {margin:0}
dl.run-in dt, dl.run-in dt:after {font-weight:bold}
dl.run-in dt {display:run-in}
dl.run-in.colon dt:after {content:": "}
XHTML
<dl class="run-in colon">
<dt>Person</dt>
<dd>Speech</dd>
<dt>Other person</dt>
<dd>Other speech</dd>
[…]
</dl>
Preview
- Luke
- A certain point of view?
- Obi-Wan
- Luke, you’re going to find that many of the truths we cling to depend greatly on our own point of view.
And the addendum for a sample style sheet for whatever the name will be:
dialog, dialog dd {margin:0}
dialog dt, dialog dt:after {font-weight:bold}
dialog dt {display:run-in}
dialog dt:after {content:": "}
For the record: Firefox doesn’t support it (I’m requesting it out loud), while Opera does for ages; so do Webkit’s nightly builds.