453535 - Cannot style INPUT TYPE=FILE completely (width is not applied correctly)

Status: RESOLVED DUPLICATE of bug 290327

(Core :: Layout: Form Controls, defect)

Description

[Josh Heidenreich]

User-Agent:       Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.9.0.1) Gecko/2008072820 Firefox/3.0.1
Build Identifier: 

An INPUT TYPE=FILE element does not apply a width set with css (i.e. width: property) correctly.

The element is always the same width.

Reproducible: Always

Steps to Reproduce:
Create a HTML document with three INPUTs, and use CSS to give them three different widths, 50px, 100px and 150px.
Actual Results:  
The inputboxes will all be the same width, and content to the right will overlap the element.

Expected Results:  
The inputboxes will be the width specified.

I would expect that the button would always remain the same size (large enough to hold the label in the users langauge), wheres the textbox would change in size. Only if the requested size is smaller than the button size should the button be made smaller, and the textbox not shown at all.

Comment 1

[Josh Heidenreich]

Attachment: Screenshot in Firefox 3 beta

Added a screenshot of how this looks in Firefox 3.0 beta 5

Comment 2

[Josh Heidenreich]

Attachment: An example of how it should look

Added an example of how it should look

Comment 3

[Josh Heidenreich]

Attachment: Testcase

The testcase used to create the screenshot

Comment 4

[Josh Heidenreich]

This bug is NOT a duplicate bug 52500, but rather a specific bug on a specific issue with a specific proposed solution.

Comment 5

[Jesse Ruderman]

How is this different from bug 290327?  (See 52500 comment 148.)

Comment 6

[Boris Zbarsky [:bzbarsky]]

I'm going to mark this duplicate of bug 290327, which does in fact cover this very issue.  I'm really sorry I didn't see it before asking that a bug be filed. :(

Please take a look at bug 290327 comment 10 and let me know what you think of that approach?

Comment 7

[Boris Zbarsky [:bzbarsky]]

Oh, if you do want to dive into code, the relevant code should be in layout/forms/nsFileControlFrame.cpp.  You want the GetMinWidth(), GetPrefWidth(), and Reflow() methods.

You might want to compare to what nsComboboxControlFrame.cpp does, since it sounds to me like the desired behavior of the two is the same.