the ryan king

I have a CSS question. I can’t seem to find anything about this in the css-discuss archives and I’m not a subscriber to the list, otherwise I’d ask there.

I have a definition list like so, alternating <dt> and <dd>:

<dl class="example">
   <dt>foo</dt>
     <dd>bar</dd>
</dl>

I want each <dt> and <dd> pair to be on the same line, with a colon between the two and the text of the <dt> right-justified. Like so:

foo:

bar

Here’s the technique I’m using:

dl.example dt {
  width: 6em;
  text-align: right;
}

dl.example dt:after {
    content: ":";
}

dl.example dd {
  margin-top: -1.1em;
  margin-left: 7em;
}

But this doesn’t seem very robust, as it won’t cope with longer text lengths. There’s gotta be a better way.

Update:

So, I got several suggestions, each essentially the same: “float:left the dt“. That was actually the original solution I had, but it got quite annoying when interacting with other, non-floated elements around it. Essentially, it means I have to put “clear:both” on the elements around this dl. It’d work, but I was just hoping there was a better way.

Just a reminder for anyone in the Bay Area that there’s an SDForum ETech SIG meeting on Microformats tomorrow night. I’ll be presenting along with Rohit, Tantek, Kevin, Ben and Ernie (I’m replacing Niall, who had a conflict).

The show is from 7-9 PM at the Cubberley Community Center in Palo Alto. I’ll be leading off some some introductory material on microformats, to be followed by some more indepth demos from Ernie and Rohit.

Did I mention that there’ll be free (as in beer) pizza?

Update: The talk went well. I did the “intro to microformats” part. Here’s my slides.

We all knew it’d happen, now Web 2.0 has hit the porn world, too. There’s now Web 2.0-style Social software for porn. Check out socialporn.com (or don’t, just believe me).

Oh, and it appears the software is open soressource.

(Via Danny)

Extratasty, where “you’ll never be sober again,” is a site for drink recipes, which includes tagging.

Awesome.

Sir* Tim Berners Lee has a blog.

I, for one, welcome our new old web overlord. :-D

* Can SHOULD Americans call him Sir?