Closed
Bug 1392164
Opened 8 years ago
Closed 8 years ago
A combination of drop-cap, float and margin makes text overlap
Categories
(Core :: Layout: Floats, defect)
Tracking
()
RESOLVED
DUPLICATE
of bug 290125
Tracking | Status | |
---|---|---|
firefox57 | --- | affected |
People
(Reporter: karlcow, Unassigned)
Details
(Whiteboard: [webcompat] [css])
Attachments
(1 file)
159.89 KB,
image/png
|
Details |
This is a spin-off of https://webcompat.com/issues/9055 of an issue on The Verge website.
I created a reduced test case in https://codepen.io/webcompat/pen/xLWYNW
p {
font-size: 1.2rem;
}
p::first-letter {
font-size: 5.2em;
color: #e5127d;
float: left;
margin: 0 .1em -.2em 0;
}
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Ut nam nulla doloribus laudantium! Numquam minima et deleniti velit ea culpa nam dolorum quisquam distinctio laborum in, provident pariatur veniam. Dolorem.</p>
The "L" is overlapping the following line. This is not happening in Chrome, Edge and IE.
![]() |
Reporter | |
Updated•8 years ago
|
Flags: webcompat?
Whiteboard: [webcompat] [css]
![]() |
Reporter | |
Comment 1•8 years ago
|
||
This is not happening in Safari too.
Comment 2•8 years ago
|
||
This was filed earlier (for The Verge) as bug 1337456, which was duped to bug 290125.
I suppose this should get the same dupe target.
Status: NEW → RESOLVED
Closed: 8 years ago
Resolution: --- → DUPLICATE
You need to log in
before you can comment on or make changes to this bug.
Description
•