SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Wizard
    Join Date
    Jan 2005
    Location
    blahblahblah
    Posts
    1,447
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    one class or multiple properties?

    Hello,

    There are multiple elements in my layour which will have, say, a left padding of 10px. Should I set this property for each element or should I create a class that I'll apply to html elements?

    Please don't hesitate to correct me, correct the way I state things etc.

    Regards,

    -jj.

  2. #2
    SitePoint Addict ornette's Avatar
    Join Date
    Mar 2005
    Location
    Tenerife, Canary Isles
    Posts
    175
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    A class would be easier in my opinion.

  3. #3
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,658
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    Here is how I do it. If there is only one instance of it and I can target it with #id p span {} then I do it that way. If there are multiple instances of the same thing then I class it.

  4. #4
    Mouse catcher silver trophy Stevie D's Avatar
    Join Date
    Mar 2006
    Location
    Yorkshire, UK
    Posts
    5,892
    Mentioned
    123 Post(s)
    Tagged
    1 Thread(s)
    It depends why they've all got a left padding of 10px. If it is inherent in the structure that they will always have the same left padding then yes, it's probably a good idea to create a class for it.

    But if it's just a coincidence that, at the moment, they all happen to be the same, you don't want anything in the HTML that ties them together - you should apply the left padding separately to relevant styles that hit each of the items. The reason is that if you want to change your design at all later, you really don't want to be messing around with the HTML - you want to be able to change everything in the stylesheet.

  5. #5
    Community Advisor silver trophybronze trophy
    dresden_phoenix's Avatar
    Join Date
    Jun 2008
    Location
    Madison, WI
    Posts
    2,820
    Mentioned
    34 Post(s)
    Tagged
    2 Thread(s)
    Stevie is right. but you have to think of it as more of a sifting process. If you merely wrote a class for every property declration, not only would your CSS be confusing after a while... but also your mark up might as well be inline css :

    <div class="pad10 fontari colRed halfwidth some more combos"> text<div>


    It's best to group logically. Typography, for example, you may want all list and blockquotes to be Arial and anything with a class of .odd. you might do something like:

    blockquote, ul, ol, . odd { font-family:arial, san-serif; }

    but for attributes like padding, margins, ect... it will become a headache


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
  •