(X)HTML5: the element is (almost) already there

HTM5/Web Appli­ca­tions 1.0 pro­poses the dialog element.

It will add some­thing on the seman­tic level (the dt is the name of the per­son). But on the pre­sen­ta­tio­nal level (CSS), this is how I’m doing for more than one year:

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>

Pre­view

Luke
A cer­tain 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 adden­dum 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: Fire­fox doesn’t sup­port it (I’m reques­ting it out loud), while Opera does for ages; so do Webkit’s nightly builds.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

*

Vous pouvez utiliser ces balises et attributs HTML : <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>