> I'm sure this has been answered before, but am not quite sure what to > search for. > > The sample scenario: > > Contain div with 18 floated divs within (acting as columns). > > To accomodate the 18 columns, I set them to a width of 5.55% > > Firefox handles this wonderfully, adjusting various divs within to > ultimately end up with 18 divs that exactly fill the container or, > worst case, 1 pixel short. > > Safari does a commendable job, appearing to round down to make sure > all columns fit within the container. > > IE is the trouble maker (as always). Depending on the width of the > container, the internal columns may fall slightly short due to > rounding (which is fine) or slightly MORE due to rounding (which is > bad, causing the last item to wrap). > > For example, a container of 500px will cause the 18th div to drop. A > conteinr of 505px will leave a few extra pixels after the 18th div. > > Obviously, this is a bit of an extreme example. This problem only > appears when you have enough individual items inside the wrapper to > compound the rounding error. > > That said, has anyone found a css-centric solution for this? I did > find a suggestion by Eric Meyer to give the last item being contained > a negative left-margin of a handful of pixels. That might be the best > solution.
Hi Darrel, The way I deal with this is by *not* floating the last container, but instead making it a new block formating context. Using zoom:1 for IE (which triggers hasLayout and works as intended) and using overflow:auto or overflow:hidden with other browsers (or keep the last float if you have no issue in other browsers). That way there is no width to set and the container fits whatever space is left. -- Regards, Thierry | http://www.TJKDesign.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/
