Closed Bug 337787 Opened 18 years ago Closed 18 years ago

button text is left-aligned when min-width is set

Categories

(Core :: Layout: Form Controls, defect)

Product:
Core
Component:
Layout: Form Controls
Version:
1.8 Branch
Platform:
x86
Windows XP
Type:
defect
Priority:
Not set
Severity:
normal

Tracking

()

Status:
RESOLVED FIXED

People

(Reporter: mike.mendley, Assigned: dbaron)

References

Details

(Keywords: css2, html4, testcase, Whiteboard: [reflow-refactor])

Attachments

(1 file)

Test case to illustrate
472 bytes, text/html
Details 
User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.3) Gecko/20060426 Firefox/1.5.0.3
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.3) Gecko/20060426 Firefox/1.5.0.3

When Firefox renders a button (or input type=button), with the min-width attribute set, the text is left-aligned instead of centered.  The behavior occurs in both Firefox and Mozilla Suite; IE6 ignores min-width, and Opera functions correctly.  Please see the attached HTML.

Reproducible: Always

Steps to Reproduce:
Run the attached HTML (attached, and below).
<html>
<head>
<title>Button input elements and min-width</title>
</head>
<body>
<input type=button value="width: auto">
<input type=button value="width: 200px;" style="width: 200px;">
<input type=button value="min-width: 200px;" style="min-width: 200px;">
<br>
<button type=button>width: auto</button>
<button type=button style="width: 200px;">width: 200px;</button>
<button type=button style="min-width: 200px;">min-width: 200px;</button>
</body>
</html>
Actual Results:  
Displays two rows of three buttons, labeled as formatted.  The "width: auto;" buttons are sized to the text. The "min-width: 200px;" buttons are 200px wide and centered.  The "min-width: 200px;" buttons are 200px wide and left-justified.

Expected Results:  
The "min-width: 200px;" buttons should be 200px wide and centered.

According to DOM Inspector, the computed styles are all "text-align: center".  When I tried setting "display: -moz-inline-box; -moz-box-align: center; -moz-box-pack: center" it made no difference.

    
  
Keywords: css2, 
          
            html4
Version: unspecified → 1.5.0.x Branch

    
  
Assignee: nobody → dbaron
Component: General → Style System (CSS)
Keywords: testcase
Product: Firefox → Core
QA Contact: general → ian
Version: 1.5.0.x Branch → Trunk

    
    

    
  
was reported as 1.8 branch; and I can confirm using a 1.8 branch build (will test as trunk later).
Status: UNCONFIRMED → NEW
Ever confirmed: true
Version: Trunk → 1.8 Branch

    
    

    
  
Fixed on the reflow branch.
Whiteboard: [reflow-refactor]

    
    

    
  
Weirdness observed with:
- Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.9a1) Gecko/2006120606 Minefield/3.0a (pre-reflow branch)
(text in right hand buttons is left aligned)

No weirdness observed with:
- Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.9a1) Gecko/2006120804 Minefield/3.0a1 (post-reflow branch)
(text in right hand buttons is left centered)

--> RESOLVED FIXED?
Status: NEW → RESOLVED
Closed: 18 years ago
Component: Style System (CSS) → Layout: Form Controls
Depends on: reflow-refactor
Resolution: --- → FIXED

    
    

    
  
Adding in-testsuite? nomination per bz's request in m.d.t.l. Sorry for the bugspam.
Flags: in-testsuite?
Flags: in-testsuite?

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






  

    
  







  

    

      
Attachment

      

      
      
      
      
    

    

      

        

          

            
General

            

              Creator: 



            

            
Created: 

            
Updated: 

            
Size: