Closed Bug 504092 Opened 15 years ago Closed 15 years ago

Changing font size of :first-letter pseudo-element changes width of display: inline-block element

Categories

(Core :: Layout: Block and Inline, defect)

Product:
Core
Component:
Layout: Block and Inline
Type:
defect
Priority:
Not set
Severity:
minor

Tracking

()

Status:
RESOLVED DUPLICATE of bug 385615

People

(Reporter: abender, Unassigned)

References

Details

(Keywords: regression, testcase)

Attachments

(1 file)

Webpage with example of bug
619 bytes, text/html
Details 
User-Agent:       Mozilla/5.0 (X11; U; Linux x86_64; en-US; rv:1.9.0.11) Gecko/2009061613 CentOS/3.0.11-2.el5.centos Firefox/3.0.11
Build Identifier: Mozilla/5.0 (X11; U; Linux x86_64; en-US; rv:1.9.0.11) Gecko/2009061613 CentOS/3.0.11-2.el5.centos Firefox/3.0.11

The last span on this page is wider than it should be, because the first letter has been styled with a larger font and the span's display style is set to inline-block.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html><head><title>Firefox bug</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<style>
span { border: 2px solid red; }
.first:first-letter { font-size: 120%; }
.inline-block { display: inline-block; }
</style>
</head>

<body>
<span class="first">Lots and lots and lots and lots of text</span>
<br><br>
<span class="inline-block">Lots and lots and lots and lots of text</span>
<br><br>
<span class="first inline-block">Lots and lots and lots and lots of text</span>
</body></html>

Reproducible: Always

Steps to Reproduce:
1. Render page with a "display: inline-block" element whose first character is a different font size.
Actual Results:  
The element is scaled by the font size.

Expected Results:  
The element should not be scaled.

    
    

    
  
I was able to reproduce the problem on Windows Vista.
Regression range is: http://bonsai.mozilla.org/cvsquery.cgi?module=PhoenixTinderbox&date=explicit&mindate=1169918460&maxdate=1169923019
Blocks: inline-block
Status: UNCONFIRMED → NEW
Ever confirmed: true
Keywords: regression, 
          
            testcase
OS: Linux → All
Hardware: x86_64 → All
Version: unspecified → Trunk
Component: General → Layout: Block and Inline
Product: Firefox → Core
QA Contact: general → layout.block-and-inline
Status: NEW → RESOLVED
Closed: 15 years ago
Resolution: --- → DUPLICATE

    
    

    
  
I suspect the testcase would have shown the bug with a float rather than an inline-block going back to when the reflow branch landed.
Summary: Changing font size of :first-letter psuedo-selector changes width of display: inline-block element → Changing font size of :first-letter pseudo-element changes width of display: inline-block element

          You need to log in
          before you can comment on or make changes to this bug.
        






  

    
  







  

    

      
Attachment

      

      
      
      
      
    

    

      

        

          

            
General

            

              Creator: 



            

            
Created: 

            
Updated: 

            
Size: