286961 - Whitespace between borders whose width is defined in EMs

Status: RESOLVED WORKSFORME

(Core :: Layout: Block and Inline, defect)

Description

[Dan Nye]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.6) Gecko/20050225 Firefox/1.0.1
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8b2) Gecko/20050320


I am seeing strange behaviour when using ems as the units for border widths.
Basically, whitespace is appearing between elements, but it is dependent on the
text zoom (for some zooms, the whitespace goes, for some it comes back). It is
noticable at the default text zoom, unfortunately.

The behaviour does not exhibit itself when the units are changed from em to px.

The test harness here:

http://www.soterm.com/dan/borderTest.html

is relatively simple, with just 3 DIV elements (with no whitespace between them
in the source, incidentally). A clear break is visible between the last two DIVs
when loaded. 

Have tested in the latest nightly Mozilla build and Firefox 1.0.1:
Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8b2) Gecko/20050320
Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.6) Gecko/20050225
Firefox/1.0.1

Not an issue in IE 6, or Opera 7.54, but also fails in NN 7.1.


Reproducible: Always

Steps to Reproduce:
1. Create 3 DIV elements
2. Give them a style with a border whose width uses ems for the unit
3. Change to 100% text zoom (Ctrl-Zero)
4. Load the code and watch the whitespace appear

Actual Results:  
You saw the whitespace between the DIV elements.

Expected Results:  
Not put whitespace between the DIV elements.

Comment 1

[Dan Nye]

Attachment: GIF image showing error in Mozilla nightly build and FF 1.0.1

Comment 2

[Hermann Schwab]

DOM Inspector Object - CSS Style Rules tells me you specified borders as 0.2em
DOM Inspector Object - Computed Style  tells me that is 3.2px

So a single border is rounded to 3px, 5 borders are 16px, and so one blank row
is inserted, instead of drawing a border of 4px instead of 3px.
You can see the same, if you make the border 1em, and resize to 120%, thats 16px
to 19.2px. 

Comment 3

[Steve England [:stevee]]

Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.8b2) Gecko/20050419
Firefox/1.0+
I see no whitespace at http://www.soterm.com/dan/borderTest.html when compared
to the image attached as a testcase

Comment 4

[Neil Paris]

Mozilla/5.0 (X11; U; Linux i686 (x86_64); en-US; rv:1.8b2) Gecko/20050416
Firefox/1.0+

Testcase wfm here. No whitespace between the elements.

Comment 5

[Kevin Brosnan]

WFM - Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; en-US; rv:1.8b2)
Gecko/20050419 Firefox/1.0+