Tuesday, August 21, 2012

Multiple CSS Classes in HTML Tag

This was a major help for me.  If your a  control freak like me you want to keep your CSS from getting out of control. I found its good to keep the layout and text formatting CSS seperate.  Lots of ways to do it. Here is a few.

You can separate out the layout and formatting by putting some info in the id, and some in the Class.

#mytag
{
    position:absolute;
    width:15px;
    top:0px;
    left:30px;
    padding-top: 6px;
    padding-left:3px;
}

.MyDiv
{


    color: #000000;
    text-decoration: underline;
    font-weight: bold;


}

<div id="mytag" class="MyDiv">Bla Bla Bla</div>


But whats really cool is that you can put multiple classes in one tag to keep your CSS more reusable.

<div id="mytag" class=" Bold Underline BlackText">Bla Bla Bla</div>

.Bold
{
    font-weight: bold;
}

.Underline
{
    text-decoration: underline;
}

.BlackText
{
     color: #000000;
}

No comments:

Post a Comment