Jump to content

i entered an infinited loop of confusion (selectors order)


Recommended Posts

Hi all, i do some css, but for some reason i missed a vital part of it and maybe someone might want to help me reset my brains a bit.


What i really can't see yet is what should be the order of the selectors in css.

for instance i see


a.fancy span{

bla: bla bla;



but somewhere else i see


.fancy a span{

bla: bla bla;


and than


.fancy, a, span{

bla:bla bla;



Is there maybe someone who can explain how to never do this wrong again. For some reason it's really confusing for me. So the question is really which selector goes first and when to use a comma when not


Link to comment
Share on other sites

.fancy a span

This targets a span element inside an anchor tag that is inside any elements that have a class of 'fancy'

.fancy, a, span

This targets all elements with a class of 'fancy', all anchor tags, and all span elements.


This targets all paragraph tags that have a class of 'centre'.

.center p

This targets all paragraph tags that are inside any elements that have a class of 'centre'

Link to comment
Share on other sites

This thread is more than a year old.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.