Definition list disc not showing up

CSS:

.about dt { 
list-style-type:none;
font-weight:bold;

}
.about dd { 
list-style-type: disc;
list-style-position: outside;
margin-left: 0px;
padding-left: 30px;
}

And the html

<dl class="about">
    <dt>Current topics and titles </dt&开发者_如何学Cgt;
    <dd>Fulfilling community residents&rsquo; appetite for information about 
    popular cultural and social trends and their desires for satisfying 
    recreational experiences</dd>
...

I want a disc before the DD, but it's not showing up in Chrome or IE. Any ideas what I've done wrong? Thanks!

---

You can also use the :before pseudo-element in CSS to insert the bullet character just before every <dd> or use a background-image on it with a bullet which would also make it cross-browser as :before isn't supported in all browsers.

---

I believe the list-style-type is meant for, well, ul/ol/li (lists). and not definition tags.

You should rewrite your syntax to use a list, or perhaps add •(•) infront of the definitions.

---

I agree with Stagas, use a background image on the <dd> of your def. list. You don't want to add special characters to the mark-up itself...remember, keep content separate from presentation. Pseudo-elements aren't going to render in IE 7 and earlier.

---

Here's a demo of stagas' approach:

http://jsfiddle.net/snifty/eLXyu/1/

.about dt:before {
  content: "\25CF";
  font-size:x-large;
  color:maroon;    
}

.about dt {
  font-weight:bold;
}
.about dd {
  margin-left: 0px;
  padding-left: 30px;
}

I used a particular Unicode character to emulate the disk. Pseudo-elements are way fun.