Element position bug in "Privilege" FAQ in Google Chrome

Question

From chrome://version:

Google Chrome   19.0.1077.3 (Official Build 128359) dev
OS              Linux
WebKit          536.4 (@111590)

The following happens on https://superuser.com/privileges/edit in Google Chrome (tested in Opera 11.62: does not happen there):

The "100%" marker for "edit questions and answers" won't fit on the clarification page for this privilege where the description gets boldfaced. It thus renders on the line below and makes the next two percentage entries also appear out of place.

This also happens for e.g. "remove new user restrictions", "cast close and reopen votes" and the other description pages with the longest names.

Answer 1

From the screenshot, one can see that the font is something ricidulously wide. It's actually one of the fonts explicitly specified in the CSS (and not a generic sans-serif fallback for people that have no fonts), DejaVu Sans Bold, and therefore a legitimate bug.

It specifies the font selection Arial, 'Liberation Sans', 'DejaVu Sans', sans-serif for the bold element in the sidebar. Verify using $('.related strong).css('font-family').

---

If you have DejaVu Sans installed (download here), you can experience this using the following code snippet:

$('.related strong').css('font-family', 'DejaVu Sans')

Enter into your browser's JavaScript console, or prepend javascript: and enter into the address bar.

Note how the links are a different font from the user's screenshot, since I changed only the style of the bold element.

---

Of course, in the meantime, just get Liberation Sans (e.g. from here), which looks almost like Arial, and enjoy nicely aligned text.

Answer 2

As slhck mentions beta/dev versions of browsers aren't supported. If you can reproduce this on the stable build, do let us know how.