Hi,

I have the site, http://screwtheschool.com and I'm installing the phparcadescript on it. My problem is with that unless specifying a specific font/size/ and line height, on a:hover, and a:active links, the links move up when hovered over and turn a different color.

I've looked through the css, but the only way I can fix these problems is for every different class that has a link, is to specify specific font size/font/line height, and then on a:hover, the links dont go wierd and the images stay in one piece.

Heres an example page with these problems: http://www.screwtheschool.com/games/386/kickoff.html
If you hover over the words, "rate", "tell-a-friend", "report" and the tiny image next to those, you'll see what I mean.

How can I fix this without adding specific attributes to all the elements?

Thanks

PS. I know the html is invalid, but its the script that causes it, so not much I can change.

You're going to hate me for saying this, but you're going to have to specify a default setting for all links first in your CSS (in order, link, visited, hover, active, LoVeHAte is the mnemonic) then again in that order if there's a group of them with different styling by a class name. And if they're not in that order it can wreak havoc. Yeah, it's work, but at least your links won't jump.

tim

yea i figured. I dont mind doing that, but my css file is getting pretty big. more than 12kb now.

12Kb ? That's NOTHING, and it's not all that big a deal either.

You CAN group selectors and avoid re-defining all the common rules over and over again. By that I mean you can do this:

#nav a:link, #nav a:visited, #nav a:active, #box a:link{
color: #cccccc;
line-height: 1.5em;
}

Then create a separate set of rules for ONLY those things that will be different for a selector.