peachskittle
02-26-2010, 03:30 PM
Hello all. My problem can be seen with the following:
<ul>
<li><label style="padding:10px 0; background: #ccc; border: 1px solid #000;">Test</label></li>
<li><label style="padding:10px 0; background: #ccc; border: 1px solid #000;">Test</label></li>
<li><label style="padding:10px 0; background: #ccc; border: 1px solid #000;">Test</label></li>
<li><label style="padding:10px 0; background: #ccc; border: 1px solid #000;">Test</label></li>
</ul>
The label's padding is ignored by the list's "li" and the li only leaves enough height for the text of the label only. Result....everything squished.
This is in IE 8/7/6. FF is happy. Can someone give me a hand here? Position relative doesn't do a thing, the only thing I've been able to do is set a height to force the height of the li, but that's not going to fly as the label could span more than 1 line. Any insight would be lovely. Thanks!
<ul>
<li><label style="padding:10px 0; background: #ccc; border: 1px solid #000;">Test</label></li>
<li><label style="padding:10px 0; background: #ccc; border: 1px solid #000;">Test</label></li>
<li><label style="padding:10px 0; background: #ccc; border: 1px solid #000;">Test</label></li>
<li><label style="padding:10px 0; background: #ccc; border: 1px solid #000;">Test</label></li>
</ul>
The label's padding is ignored by the list's "li" and the li only leaves enough height for the text of the label only. Result....everything squished.
This is in IE 8/7/6. FF is happy. Can someone give me a hand here? Position relative doesn't do a thing, the only thing I've been able to do is set a height to force the height of the li, but that's not going to fly as the label could span more than 1 line. Any insight would be lovely. Thanks!