Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    Regular Coder
    Join Date
    Dec 2010
    Location
    London
    Posts
    338
    Thanks
    63
    Thanked 11 Times in 11 Posts

    correct syntax for id and class

    Hi there. I've tried searching for this answer but I can't find it anywhere. I know this is basic but,

    Is there a difference or best practice preference between these?

    a) p#mydiv {}

    or

    b) #mydiv p {}


    And also just to make sure I'm doing this correctly, for multiple elements to be the same is this correct?

    .myclass a, .myclass p {font-family: arial}

    Many thanks. I just want to check now so I don't get two far into it and it's wrong.

  • #2
    Senior Coder
    Join Date
    Aug 2006
    Posts
    1,224
    Thanks
    10
    Thanked 269 Times in 268 Posts
    Quote Originally Posted by paddyfields View Post
    Is there a difference or best practice preference between these?

    a) p#mydiv {}

    or

    b) #mydiv p {}
    a) targets a <p> tag with an id of mydiv
    b) targets some tag with an id of mydiv with a <p> inside it. So two different things here.

    Your second question is correct.

    Dave

  • #3
    Regular Coder
    Join Date
    Dec 2010
    Location
    London
    Posts
    338
    Thanks
    63
    Thanked 11 Times in 11 Posts
    Great, thanks.

    In that case though when would you use div#mydiv {} as opposed to #mydiv{} to control an html element of <div id="mydiv"> ?

  • #4
    Senior Coder jerry62704's Avatar
    Join Date
    Oct 2007
    Location
    Springfield, IL
    Posts
    1,100
    Thanks
    13
    Thanked 87 Times in 87 Posts
    I use the #xyz format instead of the div#xyz. No point to the extra typing and it hides the darn thing more.
    .
    .
    ...and gladly would he learn and gladly teach

    Visit www.LiberalsWin.com for humor and the unique Bush/Obama Approval Polls

  • #5
    Senior Coder
    Join Date
    Aug 2006
    Posts
    1,224
    Thanks
    10
    Thanked 269 Times in 268 Posts
    Quote Originally Posted by paddyfields View Post
    Great, thanks.

    In that case though when would you use div#mydiv {} as opposed to #mydiv{} to control an html element of <div id="mydiv"> ?
    div#mydiv is a div tag with id mydiv
    #mydiv is *any* tag with id mydiv

    So again, they're two different things. I too will not typically use the first type for elements like divs. I do sometimes use them for text, where I might want to specifically target p.bold, and not just .bold.

    Dave

  • Users who have thanked tracknut for this post:

    paddyfields (01-31-2013)

  • #6
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,618
    Thanks
    0
    Thanked 645 Times in 635 Posts
    Quote Originally Posted by tracknut View Post
    div#mydiv is a div tag with id mydiv
    #mydiv is *any* tag with id mydiv

    So again, they're two different things. I too will not typically use the first type for elements like divs. I do sometimes use them for text, where I might want to specifically target p.bold, and not just .bold.

    Dave
    As you are only allowed to have one id with that value in each page the additional qualification of which tag it is in is only necessary if you have the same div in different pages in different tags and want to target it in only some of the pages. If all of the id="mydiv" are in div tags then there is no difference between the two.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • Users who have thanked felgall for this post:

    paddyfields (01-31-2013)

  • #7
    Regular Coder
    Join Date
    Dec 2010
    Location
    London
    Posts
    338
    Thanks
    63
    Thanked 11 Times in 11 Posts
    Great, thanks guys. I understand how it works now.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •