Grow your CSS skills. Land your dream job.

Using IDs in CSS selectors?

  • # December 19, 2012 at 10:37 pm

    Personally I start to use more classes than ID for now. I feel that specifies the name of the class is much easier than ID, particularly for similarity modeling without having to repeat the declaration multiple time in another selectors:

    <div id="main" class="col-group text-left clearfix">
    <div class="col left-col main pull-left"></div>
    <div class="col right-col sidebar pull-right"></div>
    </div>

    I just use the ID to indicate that the location is a primary location, “This is the primary location, primary section, primary block that is strong, and assertive”. Although I didn’t think to use it in the CSS selector.

    Try not to worry with the old CSS in my personal blog which is still widely used ID, but began to use more classes to the customer site/blog.

    Personally…

    # December 19, 2012 at 11:25 pm

    I’ve coded everything under the sun and I’ve never run into a problem using ids. If anything maybe it’s helped me become a specificity pro. I use them as I initially learned them. Use ids for page layout (header, sidebar, footer, etc) and classes for anything that may be used more than once. I believe using the #header and etc give you hooks that you can grab when ever you need to be more specific. In fact this is the most I’ve ever thought on the subject because I’ve never had to.

    # December 19, 2012 at 11:35 pm

    However, that said, I can see the allure to only use classes as well. One less thing to consider while coding. Just only use .class. You can add multiple classes to the same tag. All things good. But I’ll prob stick with what I’m used to. Ids and classes. That’s crazy though css lint actually giving a warning over use if ids. Who are they to warn me that I say tomAto and they say tomOto?

    # December 20, 2012 at 12:31 am

    @wolfcry911 Yes, you are right, specificity is a feature. The issue is that many people don’t fully understand it, and get caught out by it. Also, if you are properly minifying and gzipping then excess classes don’t really matter.

    In the end though, it’s just personal preference. You are not ‘right’ or ‘wrong’ no matter which technique you prefer.

Viewing 4 posts - 16 through 19 (of 19 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".