Posh CSS # for the modern day web designer

Submit an Article or Link Subscribe

About Posh CSS

Posh CSS is a collection of Cascading Style Sheet Articles, Tutorials, Tips and Code snippets for the modern day web designer.

Browse the site

Submit a link

Have you written or read a great resource relating to CSS that we are not linking to yet? Let us know.

Submit a Link →

Browse our Archives

Get in touch

Have a question or just want to drop us a line? Contact Us →

Posh CSS

Best CSS .Classes for CSS Toolbox

CSS is one of the most useful tools I have in my toolbox as a Web Developer. Having a CSS Toolbox containing good CSS Classes that you repeatedly use is quite helpful for us XHTML / web-standards / best-practices developers. Check out 10 of my favorite CSS classes.

# 3 Comments Posted in 238 days ago Read more at askapache.com →

Comments

  1. Not very semantic, though, is it? .CENT? What happens when you’re halfway through development and decide that you want to make those 500 centre aligned block-quotes pull to the left? Search and replace?

    The Hostile Monkey thinks you missed the point of CSS.

    Hostile Monkey
    238 days ago #
     

  2. Hostile Monkey, what are you going on about? :) Do you not understand how CSS classes work? If you are halfway through “development” and you want those 500 centred block quotes to pull to the left you just modify what .CENT does in your .css file. And if you have 500 centre aligned-block quotes on a page, please don’t use <blockquote class=“CENT”> for them, instead give the parent element a class of its own, and then do .parentelement blockquote {text-align:center}

    AskApache
    238 days ago #
     

  3. What the hostile monkey is saying is that .CENT is a shortening of the word “center”.

    Placing style descriptions as a the name of a class is only one order better than doing style=“text-align: center;”.

    Why? Because now .CENT either means “center content” or it means nothing.
    If it means nothing, why not just go ahead and do the right thing and give it a semantic name?

    All these names are unsemantic at best, and just plain confusing at worst.
    The only way they make sense is to tie them to a visual meaning.

    Let’s say in 3 months on a certain project you need all of the .FL classes to actually not float. You either remap the class to not float, or you do a find/replace.
    If you restyle the class, now your maintainability is gone, because if someone else uses that code, or you come back later and forget that you redefined FL to do something different, you no longer have any idea what it DOES do.

    Instead, don’t worry about placing style in your structure. Place MEANING in your structure, and style the structure in your CSS.

    Nate Cavanaugh
    238 days ago #
     

Commenting has closed for this article.