SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Aug 2006
    Posts
    7
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    CSS class selector

    In the book I'm working through there is a section which has a picture of an author with the author's name. The author's name is styled with a class of authorcredit.

    In the book the class selector is shown as p.authorcredit. What I would like to know is why would it be necessary to include the paragraph selector when the author's name is the only text which would be styled with the authorcredit class?

    How would experienced developers handle this in their web sites? Would they use p.authorcredit or simply .authorcredit?

    Thanks for any help

    David Gray

  2. #2
    Is Still Alive silver trophybronze trophy RetroNetro's Avatar
    Join Date
    Jul 2003
    Location
    Texas
    Posts
    6,883
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    I would leave it off myself.

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,281
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    Its more of a personal thing really.

    It isn't really needed but I do find that I am using it these days to remind
    me where and to what the style applies to.

    When working on the stylesheet I like to know that ul#nav refers to the ul exactly. If I just saw #nav then I would have to check in the html whether it applied to the ul or perhaps a parent id instead.

    Seeing ul#nav in the stylesheet I immediately know that I have to set the list-style to none/disc etc and that margins and padding for the bullets need to be considered as browsers use different methods. I can know all this without having to refer back to the html.

    Also setting something like p.test will ensure that .test only ever applies to p tags because there may be specific styling applied just for p tags (again margin and padding issues that are no relevant to divs.)

    I would never say div.test because that would clutter up the stylesheet. Therefore I know that .test can be applied to anything I want especially divs.

    That's the way I usually work.

    If its a div then don't define div.test or div#test. But if its anything else that needs to be specific then define it as p.test span.test etc. If it needs to be everywhere then define it as .test.

    When you have large stylesheets you can just read through the and almost understand the html without having to constantly switch to and fro.

    As I said its mainly a personal thing but sometimes adding the path to the style will also be necessary to give the style more weight to over-rule something else.

    As long as you have a system and keep to it then its up to you

  4. #4
    SitePoint Member
    Join Date
    Aug 2006
    Posts
    7
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks Paul

    Your detailed explanation is a great help.

    David

  5. #5
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,281
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Your detailed explanation is a great help.
    Glad it helped

    All4nerds also makes a good point for the opposing view in that you always just use .test and don't use p.test.

    The reasoning is that you can always over-ride the class when you need to with a simple class as they all carry the same weight.

    It's just another way of looking at it and all depends on how you code and what system you prefer to stick to.


Bookmarks

Posting Permissions

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