Yes they support it with attribute matching ( [type=text] ). Its just Microsoft that doesn't support this. By they way does anyone know if the new IE version will be compliant in this?

This post has been edited by twitch: Dec 20 2005, 09:02 AM

Oh well, that's very true. But the unfortunated fact is that 70% of the traffic accessing my websites are from users who use IE. And even the new version of IE released (I thought that it only compatible with the new OS), people not gonna update it soon :|.

You need to cheat the system, by using textarea.

You can use the textare just like the form input, but it allows you more control. And by simply using CSS to change the heigh, width and font styles of your textarea, you can do anything with it. Just remember to include overflow: hidden; so that none of the scrollbars show and you should be fine.



Hope that helps

A brilliant idea, twitch. Absolutely brilliant. Two thumbs-up for that one.

Actually, as far as IE7 and Microsoft in general are concerned, they don't worry so much about compliance with the W3C standards, including CSS. I haven't read anything about CSS support in IE7, but I wouldn't count on it too much. Plus, basic tests show that this bad boy is going to be devilishly vicious on system resources, so I don't suppose many will use it until Microsoft works it out.

If you absolutely can't use attributes, then I believe there isn't a way to do what you want, except for going with twitch's idea.

I'm just wondering why you're not using the width attribute in that element which isn't deprecated, it will be when XForms takes over HTML Forms though.

What your problem really seems to be though is the lack of standard support, although, using input { width: 400px; } will affect most input elements, where as input[type=text] would be more suited to what you want but the lack of support is the downfall.

The textarea solution seems alright, is it avoiding newline characters? Would it require javascript to take the event of the keypress if it's allowed to submit the default form button?


Cheers,


MC

There are two ways to do this. The first is the 'proper' syntax - the second requires a new class:

<STYLE type="text/css">

input[type=text] {
width: 300px;
background-color: cyan;
}

input.text {
width: 300px;
background-color: yellow;
}

</STYLE>

<FORM>
<input type="text"><br>
<input class="text" type="text"><br>
<input type="text"><br>
<input type="submit">
</FORM>

Excellent info thanks, what about styling the button of the FILE input field??? is there a way to change for example the color and background color of this input field???

Best regards,