Bug 84040 – Rounding Error with %

• Status: RESOLVED
• Resolution: FIXED
• Component: CSS

[Jörg Leshel]

I have Html like this:
<div class="someBodyClass">
<div class="someWrap" data-role="navbar" role="navigation">
	
	<ul class="ui-grid-c">
		<li class="logout_btn ui-block-a"><spandata-theme="b" class="ui-btn ui-btn-corner-all ui-shadow ui-btn-up-b" aria-disabled="false"><span class="ui-btn-inner ui-btn-corner-all"><span class="ui-btn-text">Logout</span></span><input type="submit" value="Logout" id="uc_header_btnLogout" title="Abmelden" data-theme="b" class="ui-btn-hidden" aria-disabled="false"></span></li>
		<li class="home_btn ui-block-b"><a  title="Home" data-theme="b" data-role="button" href="" class="ui-btn ui-btn-up-b"><span class="ui-btn-inner"><span class="ui-btn-text">Home</span></span></a></li>
		<li class="search_btn ui-block-c"><a  title="text" data-theme="b" data-role="button" class="ui-btn ui-btn-up-b"><span class="ui-btn-inner"><span class="ui-btn-text">Text</span></span></a></li>
		<li class="back_btn ui-block-d"><a title="text" class="hlBack ui-btn ui-btn-up-b" data-theme="b" data-role="button" data-rel="back"><span class="ui-btn-inner"><span class="ui-btn-text">Text</span></span></a></li>
	</ul>

</div>
</div>

Width of outer Div is 795px;
Width of inner Div is nothing - hence 100%;
Width of ul is 100%;
Width of the four li's is 25%;


Webkit is calculating width of li's wrongly.
each li is 198px (calculated metrics) and should be 198.75px.
So I have a gap between the last li and the ul.

When I give the outer div a width of 800px everthing is fine.
It's also fine when i only put in two li elements.

tested on chrome - latest version 18.0.1025.162
also tested on several mobile devices.

No margins, no paddings, actually spent a while debugging it. There is no mistake in my markup and css.
Here is my doctype:
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"

This is a Login proteced page, so can't send link

[Shezan Baig]

Can you attach a minimal test page that demonstrates the problem?

[Levi Weintraub]

(In reply to comment #0)
> Webkit is calculating width of li's wrongly.
> each li is 198px (calculated metrics) and should be 198.75px.
> So I have a gap between the last li and the ul.

You really need to add a test case that reproduces this if you want your issue addressed. That said, WebKit currently truncates the width of RenderObjects to integer bounds. This is being addressed by the work detailed in bug 60318 and described here: https://trac.webkit.org/wiki/LayoutUnit

[Shane Stephens]

Looks like this issue should now be fixed (bug 60318 is resolved). In the absence of a test-case I'm going to close this bug. Please reopen and attach a minimal test if you are still experiencing the issue in WebKit nightly or Chrome Canary.