On Mar 7, 2010, at 11:26 PM, MEM wrote: >> the parent UL & DIV are set to 'overflow:hidden', the <a> elements are >> set to display: inline. The padding (top and or bottom) is applied to the >> elements, but because it is an inline element, the >> excess padding will be clipped by the overflow:hidden. > > Ok. But if I remove the display:inline; should the padding-top and bottom of > those elements (that are no longer inline), be rendered on the viewport, > despite the overflow:hidden; declaration ? > If I remove only the display:inline; and I keep the overflow:hidden; I still > can't see the padding effects: > > http://www.nuvemk.com/formacao_lx/outros/ul_li_tests_v3.html
well the <a> element is still inline (I was referring to that element in my answer above). Try setting to <a> to display: inline-block in that test case. > > >> >> Line-height should affect the layout though. >> > and if I remove the padding declarations and try to do it with line-height > property, I still can't see any effects on the vertical space augmentation: > http://www.nuvemk.com/formacao_lx/outros/ul_li_tests_v4.html You apply the line-height to the <a> element. this won't affect the layout/height of the box which is governed by the line-box generated by the block element (LI in this case). Apply to line-height to the parent block (like the UL or the LI). or do the same as above: a {display: inline-block;} (or block) > So, I still have doubts here: >> but because it is an inline element, the >> excess padding will be clipped by the overflow:hidden. > > because it seems that, even if we remove the display:inline; property, the > padding is still clipped,if we keep that overflow:hidden; declaration. As I explained above, your <a> element is an inline element. You had originally applied that display:inline to the parent <li> (iirc). In the testcases above, you float the <li>, but you apply the padding to the <a>. > > > > Since to accomplish this, > http://www.nuvemk.com/formacao_lx/outros/ul_li_tests_v2.html > > we need to remove the overflow:hidden; declarations, may I presume that, on > this case, this is not the proper hasLayout trigger to sue? > In your opinion, what effective hasLayout trigger can be used here? I rarely use overflow:hidden for these kind of constructs. If the intent is to contain the floated blocks for 'good' browsers, there are many ways. Google 'containing floats'. if your use of 'overflow:hidden' is solely and only to trigger 'hasLayout' for IE 6 & 7, you could use 'zoom:1;' Philippe --- Philippe Wittenbergh http://l-c-n.com/ ______________________________________________________________________ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
