View Full Version : A way to shorten the CSS

Aug 22nd, 2007, 02:32 PM
Hey, here is an example with links:

#mainbody .large a {font-size: 18px;}
#mainbody .large a:link, .large a:visited {color:#60545a;}
#mainbody .large a:hover, .large a:active {color:#AA4D4D;}

I have so many things Im messing with I cant tell if that works or not :(

Do I need to define the ID and class if I shorten them, or can I just do the class? Or does the ID really matter since its all used in one area anyways?

Aug 22nd, 2007, 02:37 PM
You should just be able to do this with a class. If you apply the class to the actual link, such as: <a href="#n" class="large">Link</a> then you can put the following in your CSS:

a.large {font-size: 18px;}
a.large:link, a.large:visited {color: #60545A;}
a.large:hover, a.large:active {color: #AA4D4D;}

Aug 22nd, 2007, 03:38 PM
And to add on that you don’t even need the second line.

a.large {
font-size: 18px;
color: #60545A;
a.large:hover, a.large:active {color: #AA4D4D;}

…will do as well. You only need to specify something if it actually changes. With the first rule you specify styles for all link states, the second one overwrites the first one with things that change on hover and when active.

Aug 23rd, 2007, 08:16 PM
oh wow thanks a lot guys, thats gonna save me some space :)