The default bug view has changed. See this FAQ.

{inc} style of :first-letter used to erroneously calculate (intrinsic) width of element

NEW
Unassigned

Status

()

Core
Layout
10 years ago
2 months ago

People

(Reporter: Martijn Wargers (dead), Unassigned)

Tracking

(Depends on: 2 bugs, {regression, testcase})

Trunk
x86
All
regression, testcase
Points:
---
Dependency tree / graph

Firefox Tracking Flags

(Not tracked)

Details

Attachments

(3 attachments, 1 obsolete attachment)

(Reporter)

Description

10 years ago
Created attachment 269562 [details]
testcase

See testcase, when clicking on the button, it shrinks.
Although the end result looks more correct to me, the button should not change size when clicking on it.

Updated

9 years ago
OS: Windows XP → All
Depends on: 365131

Comment 1

9 years ago
Created attachment 318181 [details]
testcase with a floated block with first-letter

Another testcase, on a div this time.  Button sets then removes a padding.

Comment 2

9 years ago
Created attachment 318183 [details]
fix of javascript in prior attachment

removed invalid styling "none" and added a setTimeout since otherwise it didn't apply the styling.
Attachment #318181 - Attachment is obsolete: true

Comment 3

9 years ago
Also odd, is that in the (fixed) attachment after triggering recalc, there is still some white space to the right inside the div.
Summary: Shrinking button, use of ::first-letter height: 600% → font-size of :first-letter used to erroneously calculate width of element
Summary: font-size of :first-letter used to erroneously calculate width of element → {inc} font-size of :first-letter used to erroneously calculate width of element

Updated

9 years ago
Blocks: 442043
Summary: {inc} font-size of :first-letter used to erroneously calculate width of element → {inc} font-size of :first-letter used to erroneously calculate (intrinsic) width of element
Duplicate of this bug: 448169
Duplicate of this bug: 504092

Updated

7 years ago
Duplicate of this bug: 607235
Duplicate of this bug: 639744

Comment 8

6 years ago
Possible workaround: https://addons.mozilla.org/firefox/addon/bug385615/

Updated

6 years ago
Duplicate of this bug: 658792
Duplicate of this bug: 442043
Depends on: 362880

Comment 11

6 years ago
Created attachment 562320 [details]
Some more test-cases with different font-sizes and floating first-letters

Attached some more test-cases.

What I can see: with larger font-size the bigger extra width would be, the more letters after the first, again the bigger the extra width would be.

Adding float to first-letter invert this behavior, but the extra would depend only on the font-size of the first letter.

And if the font-size of the first-letter is lesser than the inline-block's, then the width of this inline-block “shrinks”.
Duplicate of this bug: 706776
Blocks: 718424
Blocks: 765798

Comment 13

5 years ago
Want to cross link two in the wild bug reports to this issue.

http://stackoverflow.com/questions/13160161/firefox-whitespace-oddity-bug-on-a-element/

http://stackoverflow.com/questions/7548255/is-there-a-css-workaround-for-firefox-bug-inline-block-first-letter-with-cha

Updated

4 years ago
Duplicate of this bug: 808989

Comment 15

4 years ago
Crosslinking another Stack overflow question: http://stackoverflow.com/questions/14130653/firefox-calculating-blocks-larger/14131771#14131771

A block-level link shrinks (recalculates its width) to the correct size when focused. All (left, right, middle) clicks trigger the fix. Tabbing onto the link triggers the fix if not prevented by Javascript. Some hover effects also fix the bug.

Manifests as an unwanted gap between floating elements.
Duplicate of this bug: 851624
Attachment #562320 - Attachment mime type: text/plain → text/html
Duplicate of this bug: 905229
Any chance of getting it fixed soon? This bug has been open for 6 years and the styling errors caused by this bug are very visible and workarounds are so ugly... This bug is a huge PITA.
Duplicate of this bug: 1108537

Comment 20

2 years ago
Still present in FF 38. Not only "font-size" but also "text-transform" triggers the bug. I'm not sure why but in my case "uppercase" makes a way bigger bug-padding than "capitalize", although the result should be (and is in standard-compliant browsers) the same.
Duplicate of this bug: 1279244
Duplicate of this bug: 765798
This applies to any aspect of the style of ::first-letter that may affect measurement (not only font-size). E.g. it can be reproduced with text-transform, font-family, font-stretch, font-weight, letter-spacing, etc. Updating the summary to make it more general.
Summary: {inc} font-size of :first-letter used to erroneously calculate (intrinsic) width of element → {inc} style of :first-letter used to erroneously calculate (intrinsic) width of element
Duplicate of this bug: 718424

Updated

5 months ago
Blocks: 1311298

Updated

5 months ago
No longer blocks: 1311298
Duplicate of this bug: 1311298
You need to log in before you can comment on or make changes to this bug.