1441089 - br with height: 0 still creates a line break in Chrome, Safari and Edge but not in Firefox.

Status: RESOLVED DUPLICATE of bug 1547246

(Core :: Layout, defect, P3)

Description

[Karl Dubost💡 :karlcow]

1. Navigate https://m.merdeka.com/foto/ .
2. Scroll down the end of the page.
3. Observe pagination navigation.

**Expected Behavior:**
Numbers are correctly highlighted (over).

**Actual Behavior:**
Numbers are incorrectly highlighted (above).

**Note:**
1. Reproducible on Firefox 56.0 Release (Mobile).
2. Not reproducible on Chrome (Mobile) 61.0.3163.98. 
3. Screenshot attached.

**Watchers:**
@softvision-sergiulogigan
@softvision-oana-arbuzov

sv; country: id
https://webcompat.com/uploads/2017/11/83c97888-f716-4467-8e2b-1c7cccec64d3.jpeg




You can jump to https://webcompat.com/issues/13071#issuecomment-364811166
for the diagnosis.

<br class="clear"> with 

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}


create a space in Gecko, but not in Safari, Edge and chrome.

Gecko seems to be aligned with the specification. 

See the reduced test case in https://codepen.io/webcompat/pen/WMjzGX 


It looks like a bit https://bugs.chromium.org/p/chromium/issues/detail?id=814610 but I think it's different.

Comment 1

[Karl Dubost💡 :karlcow]

> Gecko seems to be aligned with the specification. 

Mis-read a comment by @foolip here on Github. It was a 

> **If** Gecko is aligned.

Comment 2

[Xidorn Quan [:xidorn] UTC+10]

It seems the reduced testcase says something different? What I see from the testcase is that Gecko doesn't create a vertical space with zero-height <br> but Chrome and Safari does. Anything I'm missing?

Comment 3

[Karl Dubost💡 :karlcow]

houla… Xidorn… Yes. Talk about a botched report. What you said and what I said in my own report on the webcompat bugs.

Comment 4

[Daniel Holbert [:dholbert]]

Attachment: testcase 1

Here's a further-reduced testcase (with an extremely large line-height on the <br>, for extra effect).

It looks like Chrome is seeing the <br> and producing a (wrapper?) box that has a height of the <br> element's line-height, for some reason.  Firefox does not do that.

Comment 5

[Daniel Holbert [:dholbert]]

Edge matches Chrome's behavior on the attached testcase, FWIW. So we seem to be on our own here.

Comment 6

[Firefox Bug Husbandry Bot]

Migrating Webcompat whiteboard priorities to project flags. See bug 1547409.

Comment 7

[Firefox Bug Husbandry Bot]

See bug 1547409. Migrating whiteboard priority tags to program flags.

Comment 8

[Daniel Holbert [:dholbert]]

Duping forward to bug 1547246 since we've got a bit of a clearer explanation there.