homepage Welcome to WebmasterWorld Guest from 54.204.249.184
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

    
Problem with :not( ) + attribute selector
l008comm




msg:4530747
 10:34 am on Dec 24, 2012 (gmt 0)

So here's a super pared-down snippet of my code:

[jsfiddle.net...]

I have default styles for input that are in my header, and inputs that are not in my header. All is well, except IE applies styling to check boxes that all other browsers don't. So I want to exclude checkboxes from my default input style. But when I do this, the default input style then overrides the default header input style. And to make things more confusing, this is the selector:

input:not([type=checkbox])

However if I write that selector "wrong" like so: input:not(type=checkbox)
that works. It skips checkboxes, and it doesn't override header input boxes. But it's incorrect syntax. What is going on here? Any ideas?

 

pzin




msg:4530777
 1:13 pm on Dec 24, 2012 (gmt 0)

In wich IE version have you problems? Remember, :not just works on IE9 or later.

l008comm




msg:4530850
 8:40 pm on Dec 24, 2012 (gmt 0)

Well the initial checkbox thing happens in IE9 and IE10. But the weird not behavior happens in all browsers.

lucy24




msg:4530861
 10:22 pm on Dec 24, 2012 (gmt 0)

input:not([type=checkbox])

However if I write that selector "wrong" like so: input:not(type=checkbox)

Where did you get that the brackets are mandatory with :not? The CSS3 "Selectors" page doesn't say so, either explicitly or through their examples. If you did use brackets, I'd expect the form to be

input:not([CHECKBOX])

:: off to investigate ::

l008comm




msg:4530865
 10:36 pm on Dec 24, 2012 (gmt 0)

All the examples show it in the form I used, with brackets. Plus the CSS validator complains when I don't have brackets.

Paul_o_b




msg:4531493
 4:47 pm on Dec 27, 2012 (gmt 0)

Hi,

input:not([type=checkbox]{} is working fine it must be some other conflict in your code. It's probably a specificity issue but we'd need to see some more relevant code.


However if I write that selector "wrong" like so: input:not(type=checkbox)
that works.


No it doesn't. The rule is simply ignored because it is invalid.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved