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)

57 Branch
All
Unspecified
defect
Not set
normal

Tracking

()

RESOLVED DUPLICATE of bug 290125
Tracking Status
firefox57 --- affected

People

(Reporter: karlcow, Unassigned)

Details

(Whiteboard: [webcompat] [css])

Attachments

(1 file)

Attached image Blink left, Gecko right
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.
Flags: webcompat?
Whiteboard: [webcompat] [css]
This is not happening in Safari too.
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.

Attachment

General

Created:
Updated:
Size: