Forum Moderators: open
I have a long page full of acronyms and the phrases they stand for. I really want the search engines to see these two as directly related - the acronym and its expansion.
But, I also would like the page to have a nice visual format - all the expansions lined up as if at a tab stop on a typewriter would be great.
If I do this in a table, or in two divs, I'm concerned the "connection" between each acronym and what it stands for will be broken. But if I just line them up in sequence, the format will not be as easily readable.
Does anyone have a suggestion?
It works OK with true, full length, definitions. But these are short little jobbies.
One other issue is that some of these "definitions" will contain links. I'm pretty sure anchor tags aren't valid inside <dl>. Anyone know if they are valid inside <pre></pre>? I never know what those W3C snippets [w3.org] mean.
<!-- excludes markup for images and changes in font size -->
<!ENTITY % pre.exclusion "IMG¦OBJECT¦BIG¦SMALL¦SUB¦SUP"><!ELEMENT PRE - - (%inline;)* -(%pre.exclusion;) -- preformatted text -->
<!ATTLIST PRE
%attrs; -- %coreattrs, %i18n, %events --
>
One real ugly way to do it with CSS immediately comes to mind:
<html> <style type="text/css"> </head> <body> <dl> </body>
<head>
<title>Ugly</title>
dt, dd {
display: inline;
}
</style>
<dt>item 1</dt>
<dd>description 1</dd><br />
<dt>item 2</dt>
<dd>description 2</dd><br />
<dt>item 3</dt>
<dd>description 3</dd><br />
</dl>
</html>
Not sure about backward compatability for that, though.
You could also do:
dt {
float: left;
}
And get rid of the line breaks. This way is better IMHO.
Use the margin-right property of the dt to set the spacing for the table.
Still, I think it is a logically valid use of a table to do a list. I mean, after all, they are associated by row ...
<dl compact>
<dt>foo</dt><dd>bar bar bar bar</dd>
<dt>foo foo foo foo</dt><dd>bla bla bla bla bla</dd>
</dl>
