Unwanted extra space after DL/DD tags

How to get rid of it?

[MichaelBluejay]

Here's my code:

 <TD> 
 <DL> 
  <DT>"Blah blah blah."</DT> 
  <DD><B>--Author name</B></DD> 
 </DL> 
 </TD> 

The problem is that there's a vertical space after the Author's name -- as though I had a <P> after the name. But there's no <P> there at all, is there? No, there's not, have a look, no <P>.

I tried to fix this with:

 DD { margin-left:10px; margin-bottom:0px; padding-bottom:0px;} 
 DL { margin-bottom:0px padding-bottom:0px;} 

...which did nothing. I added "border-bottom:1px solid red" to the DD and DL definitions, and that showed that each element ends BEFORE the extra space. Why is that extra space there and how can I get rid of it?

I suppose I can get the effect I want by using <P>'s and <BR>'s instead of Terms & Definitions, and then just use a transparent GIF to indent the Author's Name line, but that seems soooo 90's.

Thanks for your help.

[createErrorMsg]

I'm going to reveal my ignorance here and say that I've never even heard of <DD>, <DL> and <DT>, and would love to learn what they are and what they're for.

As for your problem, however, why not use <p> and <br> tags, as you said, but use the style attribute text-indent: Xpx; in a class or id for the <p> tag containing the Author's Name, as opposed to a transparent gif?

css:
.indent {
text-indent: 15px;
}

html:
<p class="indent">Author's Name</p>

[pageoneresults]

Here is a recent topic that might be of help...

Definition Lists and Semantics [webmasterworld.com]

[drbrain]

It looks like you're marking up quotations.

It would be better to simply use the q or blockquote elements than using definition lists, since you don't seem to provide a definition of anything.

[SuzyUK]

DL { margin-bottom:0px padding-bottom:0px;}

there is a typo in there ;)
missing semi-colon after margin-bottom's rule..

That should fix the default margin on the <dl>

createErrorMsg it's a type of list element
Definition List [w3.org]
<dl> - definition list
<dt> - definition title
<dd> - definition data

Suzy

[choster]

Suzy beat me. I do agree with drbrain. The author is the author of the quote, not a definition or description of it, so I don't think <dl> would be semantically correct here.

[MichaelBluejay]

(1) The <q> tag is useless because it doesn't format the text.

(2) I can't believe you all are hassling me because I'm using DD tags for text that isn't a definition! Since when did the semantic meaning of the tags become important? My readers don't determine what kind of content I'm presenting by looking at my source code and seeing which tags I use, they figure out what I'm offering by looking at the actual outputted page. Just because it's *called* a definition tag doesn't mean it has to be used that way. Is every instance of <P> a paragraph in the traditional sense of the word (i.e., a collected of related sentences)? I don't think so.

(3) The missing semicolon was the problem. Duh. I can't believe I wasted bandwidth on WebmasterWorld for that. I will help five other people as my penance.

[Purple Martin]

(1) The <q> tag is useless because it doesn't format the text.

The <q> tag is useful because it conveys meaning (a short quotation). It can format text if you want it to, by styling it with CSS. Semantics are important! (See my comments below)

(2) I can't believe you all are hassling me because I'm using DD tags for text that isn't a definition! Since when did the semantic meaning of the tags become important? My readers don't determine what kind of content I'm presenting by looking at my source code and seeing which tags I use, they figure out what I'm offering by looking at the actual outputted page. Just because it's *called* a definition tag doesn't mean it has to be used that way. Is every instance of <P> a paragraph in the traditional sense of the word (i.e., a collected of related sentences)? I don't think so.

Your typical browser users don't determine what kind of content you're presenting by looking at your source code and seeing which tags you use. However, your other users (humans using screenreaders, mechanical users e.g. spiders, and any number of other kinds of readers) can gain useful information from the meaning of tags. For example, a screenreader can use a different tone of voice for a quotation so that the listener can tell the difference. For another example, a university's search engine spider might be configured to look for quotations in documents. Don't assume that just because a tag's text is not styled by default in IE or Netscape that there is no point using that tag. Semantic markup is very important as it can convey useful information to all user-agents, whatever they may be. The good news is that semantic mark-up is really easy to do and doesn't take up any extra time, and once you're in the habit you don't even realise you're doing it. The really good news is that it will actually save you time making your documents look good, because you can use CSS to quickly style tags across your entire site.

[MichaelBluejay]

Semantic markup is very important as it can convey useful information to all user-agents, whatever they may be.

I'm not at all convinced.

I put the missing semicolon in and I'm very happy with that solution. Can't get any easier or simpler than that.

[Rambo Tribble]

The Web was conceived as the "Semantic Web". The idea being that things could be found on it according to their meaning and context. This is what search engines seek to do, though they are, admittedly, imperfect at it.

On the first rendition of my site, I too concerned myself more with appearance than semantics. Quick'n'dirty, it looked right across browsers, but wasn't semantically correct, or particularly tight.

About a year later I went back, did a total redesign observing good semantic composition rules. My search engine rankings shot up overnight. Take it for what it's worth.