Best practice - Using Utility Classes, Yes or No?

Posted on 2014-08-26
Last Modified: 2014-09-03
I'm trying to get away from years long habits of writing inline styles and move toward standalone stylesheets.

I'm wondering your thoughts on creating a utility class sheet (as well as sheets for specific purposes)

things like

.glow {
	color: white;
	text-shadow: black 0.1em 0.1em 0.2em;}

Open in new window

It seems to me to make sense especially when you can chain them

<div class="headline indent-15 glow">Some Text</div>

but does that follow best practice?

It does keep the page markup cleaner and does allow changes to the CSS without changing the page markup but something like this


seems weird somehow.

I'll probably continue to do this in any case because it seems to work for me but I'm just wondering what others are doing.
Question by:SidFishes
    1 Comment
    LVL 58

    Accepted Solution

    Nothing wrong with it, everyone has their own style of writing CSS

    Featured Post

    How your wiki can always stay up-to-date

    Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
    - Increase transparency
    - Onboard new hires faster
    - Access from mobile/offline

    Join & Write a Comment

    As a result of several questions about how to use Bootstrap I thought it would be a good idea to write down the development aspect of creating a Bootstrapped website in as little time as possible. Part 1 of this article will only concentrate on g…
    This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
    In this Micro Tutorial users will learn how to embed custom fonts into websites using @font-face in CSS Select a font: Ensure the EULA allows you to use @font-face: Download the font: Get the browser-compatible files you need: Edit your CSS       - Name …
    In this tutorial viewers will learn how add a full-size background image to a webpage using CSS3. Create a new HTML document with an internal stylesheet.: In CSS, define the html element to have a background image. Use a high resolution image.: In t…

    754 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    17 Experts available now in Live!

    Get 1:1 Help Now