p width in ie6? [css]

Caporegime
Joined
18 Oct 2002
Posts
29,493
Location
Back in East London
Hello,

I have a series of lists (ul's) which I am trying to display as shown in this screen shot (ff/opera/safari/ie7 display):
list.gif


The style sheet:
Code:
ul.articlelist {
	width: 100%;
	display: table;
	list-style: none;
}

ul.articlelist li.articleitem {
	border: 1px dotted #5A2815;
	margin-top: 5px;
}

ul.articlelist ul.articleinner {
	display: table-row;
}

ul.articleinner li {
	display: table-cell;
	padding: 2px;
}
li.date span {
	text-align: center;
}
li.date span p {
	width: 14em;
}
li.headline {
	font-weight: bold;
}

A snippet from the markup:
Code:
<ul class="articlelist">
  <li class="articleitem type4">
    <ul class="articleinner">
      <li class="date">
        <span>
          <p>1 June 2007</p>
        </span>
      </li>
      <li class="headline">
        <a href="http://localhost/articles?_s=pwDDJAwYLaKpFaGm&_k=KdcPSbVi&15">Special Report: UPS REMAINS A LOW-KEY PLAYER IN THE MIDDLE EAST</a>
      </li>
    </ul>
  </li>
</ul>
(class type'x' is only for highlighting using background-color: blah)

But in ie6:
listie6.gif


Any ideas?

Many thanks.
 
I've opted for float left on all the p's. Did try out a small example of DL's and it sort of works, but I have to have each dt/dd within it's own dl, and a br between dl's to make it tabular, which is not ideal.

The reason not for tables is because it isn't actually tabular data, it is a menu list. (The headlines are links to other pages)
 
Back
Top Bottom