What is the correct (or difference) between div#main { and #main { H...">
Geek asks and answers

Recommended css entry

I have a div with id:

<div id="main">

What is the correct (or difference) between

div#main {

and

#main {

Hi,

+5
source share
4 answers

great doco on using efficient CSS selectors, focus on rules with overly qualified selectors:

Identifier selectors are unique by definition. Including a tag or class, qualifiers simply add redundant information that needs to be evaluated unnecessarily.

, id main, , , div ( ). : css , jQuery ..

Re pixelistik , div#main , #main - , , , , , , CSS, , .

+3

, , :

div#main, <div>. #main, <div>, <span>, <p> ..

, , -. span.<nameClass>, <li>, .

#nav li span.href a {
 ...
}

, , , - .

, span#href, <span id="href">Simply dummy text</span> . #href, <span id="href">Simply dummy text</span> <a href="#" id="href">Link</a>, , . , .

+2

#main ID 'main', div#main <div> main.

Ideally, you should never have two elements with the same identifier, so realistically these two do not matter, but probably performance problems are related to whether the specification indicates divthe result faster.

+2
source

Both are correct.

div#mainmore specific than #mainthat which means that styles defined with the first selector will override the characters of the second.

Here's a good introduction to the CSS spec: http://htmldog.com/guides/cssadvanced/specificity/

+1
source

More articles:


All Articles