4 Replies Latest reply on Apr 5, 2010 7:20 AM by martcol

    CSS Rule of thumb

    DeonH Level 1

      Hi there.

       

      I just want to know from you guys:

       

      Is there a rule of thumb for what normally is declared here:

       

      #content {

       

           }

       

      and what is declared here:

       

      #content p {

       

           }

       

      Thank you very much.

       

      Regards,

      Deon

        • 1. Re: CSS Rule of thumb
          martcol Level 4

          I'll kick off on this one.

           

          I don't think so.

           

          I  reckon it's about what you are doing and how you want to go about building your site.

           

          The rule of thumb really is that  the more general a CSS style is the less specific your rule needs to be.

           

          You  can for instance declare your font-family in a rule for your  <body> element and that will affect all your <p> elements if  they are otherwise unstyled.

           

          But if you only want to  style <p> elements that are children of <div id="content">  then you would use a rule on #content p

           

          I think you  might like to do a bit of research on CSS Specificity and CSS  Inheritance.  That might help.

           

          I also think that the  more CSS you do the more that you will develop your own rules of thumb.

           

          Martin

          1 person found this helpful
          • 2. Re: CSS Rule of thumb
            DeonH Level 1

            Thanx Martin.

             

            Your answer makes perfectly sense. It's the "children" that make things potentially difficult.

             

            Thanx for the time in answering.

             

            Deon

            • 3. Re: CSS Rule of thumb
              martcol Level 4

              http://penguin.theopalgroup.com/cgi-bin/css3explainer/selectoracle.py

               

              That's a handy little utility - it's good fun to use.  Type in your selectors and it will explain to you in human what it effects.

               

              It won't help you with your rules of thumb but it can be useful to check out how to construct your selectors when you start styling elements that are deeply nested.

               

              Martin

              • 4. Re: CSS Rule of thumb
                DeonH Level 1

                Martin, this is excellent! I will surely play around with it.

                 

                Deon