html - Some selectors doesn't work for me -


i writing selectors didn't work me.

html code :

<h2 rel="singer-connector-cricketer">shoaib chikate</h2> <h2 rel="dancer-build-tester">ashok dongare</h2> 

css code:

h2[rel|="connector"]{     color:blue; } 

css tricks attribute

similarly :matches() selector not working although i'm using higher version of chrome (version 32.0.1700.77).

html code:

<div id="matcher">         <p>matched</p>         <h1>not</h1>         <h2>matched</h2>         <h3>not</h3> </div> 

css code:

#matcher :matches(p,h2){     color:purple; } 

how selectors work?

css tricks selectors- :matches()

jsfiddle

h2[rel|="connector"] looks attribute value starts "connector" followed hyphen. not attribute value has word "connector" anywhere among set of hyphenated words — value must start given string.

since 2 elements given have rel attributes values start "singer-" , "dancer-" respectively, neither of them matched.

i'm not aware of version of chrome supports :matches() yet. latest stable version (34.x of writing) still support :-webkit-any(), however.

of course, should go without saying shouldn't use :-webkit-any() , rest of prefixes in production code, because css error handling rules mean using in current prefixed state causes have write duplicate rules each prefix, runs counter intended purpose. see this answer example. can test these new selectors want, there's little gain trying use them in production while support them still poor.


Comments

Popular posts from this blog

windows - Single EXE to Install Python Standalone Executable for Easy Distribution -

c# - Access objects in UserControl from MainWindow in WPF -

javascript - How to name a jQuery function to make a browser's back button work? -