Firefox adds extra space for span element if it has flex parent and comments or other empty elements inside
Categories
(Core :: Layout: Flexbox, defect, P3)
Tracking
()
People
(Reporter: sawqe1, Unassigned)
Details
Attachments
(1 file)
|
373.74 KB,
image/jpeg
|
Details |
ff.jpg
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.97 Safari/537.36
Steps to reproduce:
If we have "div" (a) element with display flex, second "div" (b) is inside first (a), "span" (c) is inside second "div" (b) with margin and 2 or more empty tags inside "span" (c) (each is on a new lines), Firefox adds extra space for "span" (c). See example below.
Try this:
https://jsbin.com/jokumibuna/edit?html,css,output
OR
Open page with code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Title</title>
<style>
#a {
display: flex;
}
#b {
background-color: red;
}
#c {
margin-left: 1px;
}
</style>
</head>
<body>
<div id="a">
<div id="b">
<span id="c">test
<!-- -->
<!-- -->
</span>
</div>
</div>
</body>
</html>
Actual results:
Firefox adds extra space below span element (see attachment)
Expected results:
No extra space
|
||
Comment 1•5 years ago
|
||
Hi,
I was able to reproduce this issue on Firefox 71.0 and Firefox Nightly 73.0a1.
I'm setting a component in order to involve the Devteam in reviewing this issue.
Thank you for reporting!
|
||
Updated•5 years ago
|
It seems this bug relates to inline element and empty element after that.
https://imgur.com/a/a11nAzM
Thank you!
|
||
Updated•5 years ago
|
|
||
Updated•2 years ago
|
Description
•