Closed Bug 253690 Opened 20 years ago Closed 12 years ago

<input type="file"> ignore border style

Categories

(Core :: Layout: Form Controls, defect)

defect
Not set
normal

Tracking

()

RESOLVED FIXED

People

(Reporter: osavill, Assigned: mounir)

References

()

Details

(Keywords: testcase, Whiteboard: [fixed by bug 52500])

Attachments

(1 file, 1 obsolete file)

User-Agent: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8a3) Gecko/20040729 Firebird/0.8.0+ Build Identifier: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8a3) Gecko/20040729 Firebird/0.8.0+ The above URL has a <select...> and an <input type="file"...>. The CSS for each is defined as: input { width: 100%; height: 1.3em; border-style: solid; border-color: #bacae1; border-width: 1px; color: #19519d; font-size: 0.7em; font-family: arial, helvetica, sans-serif; } select { width: 100%; border-style: solid; border-color: #bacae1; border-width: 1px; color: #19519d; font-size: 0.7em; font-family: arial, helvetica, sans-serif; } I don't know quite when this happened but neither of the above two HTML elements apply these attributes any more. IE and Netscape 6 does apply them (IE arguably better than Netscape 6 because the style is applied to the input area ad the Browse button, whereas Netscape 6 simply puts the border around both elements which are in turn rendered with no style attributes !!!) Reproducible: Always Steps to Reproduce: 1. 2. 3. Expected Results: The Border style should be applied to all <input> and <select> elements.
Attached file Testcase (deleted) —
Border-color seems to work for me for both (see also bug 53590), using: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8a3) Gecko/20040728 Firefox/0.9.1+ But border-style and border-width don't work. I don't think they ever worked.
For select, see bug 94387. That behavior is exactly as we want it. For <input type="file"> the "border-style: none !important" was added in bug 106317 and I'm not quite sure why... fantasai, what was the reason? It may be worth commenting in the file.
> For select, see bug 94387. That behavior is exactly as we want it. Last comment from Issue "verified www.juno.com page has changed. bug is now invalid." !!! The issue wasn't resolved since the problem item just disappeared from the page. If you look back at the Netscape 6 era builds you'll find that Mozilla / Netscape applied the border attributes correctly to <select>. Comments within Issue 94387 also discuss the fact that the CSS spec. does not cover borders for form fields. But having borders applied for some form fields (input fields and buttons) and not others (select drop downs and file browse) is a little inconsistent. Moreover, the whole effect is very pleasing in IE and Opera but looks a little odd in the Mozilla family :-( Could the !important be affecting other form fields also ?
The file input text field is inheriting the border color from the file input element. The idea was to make the text input's border the conceptual file input border, so the border around the file input itself is display: none;
> The idea was to make the text input's border the conceptual file input > border, so the border around the file input itself is display: none; That's fine, except the file input box and it's Browse button actually have large bevelled borders that almost mask any CSS applied border. Moreover, by the time the CSS applied border is large enough to be properly seen the whole effect just looks very strange. The most pleasing solution, sadly, is IE's where they have default bevelled borders unless CSS defines one, in which case it is used instead. What about <selects> ? Should I raise a separate issue for this ?
> What about <selects> ? Should I raise a separate issue for this ? You did read bug 94387, right? border-style is ignored on almost all form controls, in fact, not just <select>.
From 94387: Let's put in !important for now and fix the entire stylable of form controls thing later. and: Note that form controls should be styleable via userContent.css, and this change braeks that. and: hmmm..... http://www.juno.com have made changes to their page. There is no pulldown on the top right ("Explore by Category") anymore. ... verified www.juno.com page has changed. bug is now invalid. Was the "entire stylable of form controls thing" ever really addressed ? Just because juno.com don't display these controls doesn't mean the bug is now invalid ! > border-style is ignored on almost all form controls, in fact, not just > <select> Why ? Almost is inconsistent. I now know that apparently the standards don't refer to these directly but then I guess most shot gun hand books don't say "Congratulations on purchasing your new shot gun. Don't shoot any one with it." either !!! :-) Why, since NS6 went more than half way by applying border styles to <select>s and giving browse controls an overall border, was this removed rather than continuing as was or by giving the browse control a nicer border also. Or does this come full circle back to "entire stylable of form controls thing" ? I don't want this to turn into a battle of wills. If you really don't want this issue fixed that's fine. I am just trying to help Mozilla / Fire Fox be the best out there, and turning a nice graphically designed page into a cludge is not the best way to do it !! :-O
> I now know that apparently the standards don't refer to these directly Huh? That's not true. Here is the exact language (from http://www.w3.org/TR/CSS21/conform.html ): CSS2.1 does not define which properties apply to form controls and frames, or how CSS can be used to style them. User agents may apply CSS properties to these elements. Authors are recommended to treat such support as experimental. A future level of CSS may specify this further. To use your shotgun analogy, the manual says "If you point the gun at someone and pull the trigger, it may or may not kill them." Then you complain when you do just that and the man isn't actually killed. As for the Juno page, there were other sites showing the problem as well; it wasn't just Juno. Finally, given that CSS does not define how things should work, any work put into making them work a given way is going to be wasted if a different way is specified in the end. If you find someone with the extra time on their hands to do work that's likely going to have to be redone, feel free to try and talk them into dealing with styling of form controls.
Attached patch patch to re-enable styling of select borders (obsolete) (deleted) — Splinter Review
Just created a patch to re-enable select border styles. it took about two minutes. I used the forms.css that comes with firefox. not sure what version (as in cvs file version of the forms.ccs file). I like pretty borders on select elements. Screw whatever IE does.
Depends on: 244370
Changing Summary since bug 244370 fixed the <select> part.
Summary: <select> and <input type="file"> ignore border style → <input type="file"> ignore border style
Attachment #158388 - Attachment is obsolete: true
Keywords: testcase
Assignee: dbaron → nobody
QA Contact: ian → style-system
No. Let's keep one bug per issue instead of dupping to tracker bugs, ok?
Depends on: input[type=file]
Status: UNCONFIRMED → NEW
Ever confirmed: true
OS: Linux → All
Hardware: x86 → All
Assignee: nobody → mounir
Status: NEW → RESOLVED
Closed: 12 years ago
Component: CSS Parsing and Computation → Layout: Form Controls
Resolution: --- → FIXED
Whiteboard: [fixed by bug 52500]
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: