Don't get me wrong, I love the DL. I've been accused of abusing it way too
many times :)
However, I think you should simply use a data table for this. The table will
solve many of your layout questions. It also provides more structural
feedback for screen reader users.
For CSS
table {border:none; padding:0;}
td,th {border-bottom:1px solid #ccc; vertical-align:top;}
th {font-weight:bold;}
<table id="data-attribute" summary="Gyokuro basic information">
<tr>
<th scope="row">Summary</th>
<d>The finest of Japanese teas, Gyokuro bushes are covered for several weeks
before harvest with bamboo or straw shades to increase the chlorophyll
content of the leaves. The results of this transformation are the renowned
dark green leaves with high concentrations of Antioxidants, vitamins and
amino acids. Celebrated for its emerald green infusion and sweet
aftertaste.</td>
</tr>
<tr>
<th scope="row">Weight</th>
<td>100.0000</td>
</tr>
<tr>
<th scope="row">Ingredients</th>
<td>N/A</td>
</tr>
</table>
On 3/31/11 7:25 PM, "tee" <[email protected]> wrote:
>
> On Mar 31, 2011, at 4:56 AM, Russ Weakley wrote:
>
>> 1. I think you invented a new property "overholow:hidden". Supposed to be
>> "overflow: hidden;" ?
>
> Typo.
>>
>> 2. If you place the borders on top of the elements, you have no lining up
>> issues:
>
> I believe I didn't asked the question correctly. Too tired! The problem isn't
> seemed to be causing by the border line. In that quick test page it shows
> correctly though I forgot.
>
> Please see this page.http://bit.ly/ijuKS4. click on Product data, the CSS
> codes are identical to http://jsbin.com/emiye5/6/.
> You can see that Ingredients (DT) drops under previous set of DD when the
> content is too short.
>
> In most cases, I don't declare width for DL when it's wrapped inside a
> container (#tab {width:100%}) which already has a width, but in this case, I
> added a 700px for DL. I thought maybe a DD or DT somewhere else causing it, so
> I added important rule making sure no extra paddings/margins got in the way.
>
> My hunch is somehow browsers couldn't get the correct calculations due to
> relative position somewhere?!
>
> @JC, thanks for the suggestion for wrapping dl on each set. Really tried not
> to do that to create extra codes as there are too many areas that I couldn't
> keep them lean.
>
> tee
>
>
>
> *******************************************************************
> List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
> Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
> Help: [email protected]
> *******************************************************************
>
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [email protected]
*******************************************************************
