Created attachment 74728 [details] Screenshot of the underflow taken from Chrome 7.0.517.44 I setup a layout with two columns. The layout has a width of 1001px. The columns have a width of 50%. The later column doesn't take up enough space on the right in Chrome7 and Safari5 because of (what appears to be) a 1px underflow. It appears to be that Chrome is rounding down the value of the % (eg both columns at a width of 500px) which leaves a last float looking a pixel short. This reminds me of the IE6/7 pixel overflow issue, where IE6/7 was rounding up the value of the % (eg both columns at a width of 501px) which caused the last float to stack.
Same as https://bugs.webkit.org/show_bug.cgi?id=5531
Created attachment 461259 [details] Safari 15.6 matches with Chrome but differs from Firefox I looked into Wayback archive for the above and changed into following JSFiddle: Link - https://jsfiddle.net/2h6b1x04/show As can be seen from attached screenshot, Safari 15.6 matches with Chrome Canary 106 but differs from Firefox Nightly 105. I am not clear now web-spec or whether it is duplicate of any other bug but just wanted to share updated results. Thanks!
The difference here in between Firefox and Safari/Chrome on the other side is the height of the height of the layout wrapper. In Safari/Chrome, it is 0px In Firefox, it is 210px The layout difference is created by <wbr style="clear: both; display: block; "> If I replace `wbr` by `div`. The layout is the same in the 3 browsers. <div style="clear: both; display: block; "> </div> So it seems to depends on the wbr imple https://html.spec.whatwg.org/multipage/text-level-semantics.html#the-wbr-element The initial report was about the red space showing on the right side of the column. This is not the case anymore in the 3 browsers. So This is solved with regards to this specific issue. The WBR behavior and the wrapper seems a different beast which is unrelated. :)