That bug shows up when:
width
is set in %
(like 100%)If the value of width
is expressed in pixels or ems, bug is not triggered.
As you can see, moving towards the items on the right, their nested UL is cropped more and more. Precisely, IE (both 6 and 7) is calculating 100% as starting from the left edge of the parent item to the end of the main UL.
Solution is to use expression
property:
.navig ul { width: expression((this.parentNode.parentNode.offsetWidth - parseInt(this.currentStyle.paddingLeft) - parseInt(this.currentStyle.paddingRight)) + 'px'); }
Obviously, this will work only if padding is expressed in pixels, because parseInt(ELEM.currentStyle.paddingLeft)
will return the value, without the unit. If you use 2em it will return 2, if you use 20px it will return 20. Calculation would not be right in the first case.