Page 1 of 1
CSS Attribute Selectors In IE
Posted: Mon Oct 23, 2006 3:56 pm
by JellyFish
When I use this in the head of my document:
Code: Select all
input[type="text"] {
boder: bla bla;
}
It works as expected in FF and Opera. BUT in IE it doesn't do anything at all. Why doesn't IE understand this selector syntax? I change it to just "input" and it understands I tried "input[type~="text"]" and "input[type|="text"]" and nnnnnnwwwwwe!!!

Posted: Mon Oct 23, 2006 5:18 pm
by RobertGonzalez
Other than that, I can't help much, but I am sure it has something to do with IE's lack of compliant CSS rendering.
Posted: Tue Oct 24, 2006 1:04 am
by JellyFish
Waaaaa!!!! I don't like this. I want it to work in IE. I want every text input field to be styled this way. How can I do this in both IE, FF and Opera, with or without this selector???
Posted: Tue Oct 24, 2006 8:24 am
by RobertGonzalez
There are several syntax usages that confuse IE. You might want to google IE css hacks. There are entire communities dedicated to the subject.
Posted: Tue Oct 24, 2006 10:53 am
by Maugrim_The_Reaper
Here's a informational blog post:
http://rakaz.nl/item/how_well_do_browse ... _selectors
Seems IE7 even is far behind the like of Firefox. If that's true of the final IE7 release... If anything, this demonstrates MS have a long road to travel before catching up with Firefox (which has FF2 on release later today with Javascript 7 and client caching). Does httpOnly cookies stack up FF2's improvements? I think not...
Check the blog entry and linked to browser tests - you can run your own tests, and click orange/red rows for extra details. I tested IE6 and it showed the standard attribute=value test fails if an attribute value is uppercase. Check you html, and make sure all attributes and their values are
lowercase where possible (obviously not for real text though...). Also delete any whitespace between the quotes and a value, which is flagged as another reason for IE6 to fail.
Posted: Tue Oct 24, 2006 11:20 am
by RobertGonzalez
I took the test at
http://www.css3.info/selectors-test/index.html and came up with...
Firefox 1.5.0.7 - 26 Passed, 10 Buggy and 7 Unsupported of 43 Selectors
Opera 9.0.1 - 23 Passed, 3 Buggy, 17 Unsupported
Explorer 6 - 10 Passed, 1 Buggy, 32 Unsupported
Explorer 7 - 13 Passed, 4 Buggy, 26 Unsupported
Posted: Tue Oct 24, 2006 4:56 pm
by JellyFish
Okay. Clear questions: What selector would I use in CSS to select all the textbox's in IE??? What's the syntax???
Posted: Tue Oct 24, 2006 5:26 pm
by nickvd
if input{} is not enough, you'll have to either use javascript, or add a class to all the text boxes you want to select...
Posted: Tue Oct 24, 2006 5:39 pm
by Maugrim_The_Reaper
You might try the form id value, and use a child/descendent selector...assuming IE6 let's you.

.
Javascript would work either way, but a CSS solution would be better.
Posted: Tue Oct 24, 2006 8:06 pm
by JellyFish
if input{} is not enough, you'll have to either use javascript, or add a class to all the text boxes you want to select...
Input won't work. It also includes the sumbit buttons etc.
Posted: Tue Oct 24, 2006 11:41 pm
by RobertGonzalez
But it won't affect input buttons if you use the button tag instead of input tag.