Re: Why can I not attach a style to an tag in Netscape 6 ??

[Alfred Kayser]

Alfred Kayser wrote:
Oops, forgot the attachments:

> Mark Pawelek wrote:
> 
>> I've been writing a DHTML intensive application for database 
>> administration.  It works well with IE4+
>>
>> Recently I decided to extent it the Mozilla browser.  The DHTML was 
>> going fairly well despite a few hiccups, The style sheets were written 
>> by a designer who naturally expects all web-sites in these related 
>> applications (mine and several others) to use the same style. File 
>> upload is integral to the application.
>>
>> In view of what I read here the best course of action is for me to 
>> drop support for Netscape and simply demand that users get IE.
>>
>> Is that really what the designers of Mozilla want?
>>
>> On Wed, 03 Apr 2002 11:31:51 -0500, Boris Zbarsky <[EMAIL PROTECTED]> 
>> wrote:
>>
>>
>>> Mark Pawelek wrote:
>>>
>>>> Is there any way a style can be attached to the <input type=file> tag?
>>>
>>>
>>> <input type="file"> cannot be described in terms of CSS.  Appendix A 
>>> to the CSS2 spec ("A sample style sheet for HTML 4.0") explicitly 
>>> says so.  This means that any application of style to it is 
>>> unpredictable to start with and should be avoided.
>>
>>
>>
> 
> Using the attached example, it can be shown that Mozilla can
> apply some styles to a <input type="file">:
> 
> However, as it shows only font and font-size can be changed,
> or the whole <input type="file"> can be hidden using display: none.
> 
> See the css file on how the elements of a <input type="file"> can be 
> styled. Note that to 'security reasons' the elements within the
> <input type="file"> cannot be styled (except for font and font-size).
> 
> It should be possible to get a reasonable effect, even in mozilla ;-).
> 
> Turn on 'XBL-based form control' in the Edit/Preferences/Debug panel
> to get the best effect.
> 
> Greetings, Alfred Kayser
> 
> 



/* Page settings */
body {
    background-color: green;
}

/* Overall settings */
input[type="file"] {
    font: Times;
    font-size: 24px;
}

input[type="submit"] {
    color: red !important;
    background-color: blue !important;
    border-color: pink !important;
    border: 0px;
}

/* Do the textfield */
input[type="file"] > input {
    color: blue !important;
    background-color: red !important;
    border-color: yellow !important;
    border: 0px !important;
    display: none;
}

/* Do the button */
input[type="file"] > input[type="button"] {
    color: red !important;
    background-color: blue !important;
    border-color: pink !important;
    border: 0px !important;
}

Hidden field: OK
Normal field with styles: OK