pseudo classes

[tk2k1]

hey. I am coding the style sheet for a website that I am working on and am having a bit o' trouble. I have 9 boxes created with css and divs, with each having a different position on the page and therefore a different css statement. For example, the first box is coded as follows:div.link-box11 {border: 0px;background-color: #FFF;position: absolute;top: 20px;left: 250px;width: 240px;height: 40px;}So I have 9 of these statements, and I now want to add the :hover pseudo class to each of them, so that the box changes colour when the pointer is over it. Now I could do it the long way, but I want to learn a shortcut, if there is one, for future reference. Is there any way to code this so that I can reference all 9 boxes with maybe just one statement?thanks!

[Err]

Sure there is. You can call all your div tags to have a certain styling. You can also narrow your call for the div by calling another tag, say like a table or another div. EX:

.box div {  color: blue;}.box div:hover {  color: red;}

Where ".box" narrows down the div tags you want to have that styling.Which can save A LOT of time.That's assuming that you have those div's nesting inside a tag like:

<div class="box">  <div> </div>  <div> </div>  <div> </div></div>

The :hover pseudo works in all browsers execpt IE, where you HAVE TO have a link for it to work.So this css w/ the :hover will work in IE.

<style type="css/text">div a, div a:visited {  color: blue;}div a:hover {  color: red;  font-wieght: bold;  letter-spacing: 2px;}</style>

Now, this css w/o a link anchor will not work in IE. Don't ask mefor a way around this problem... cuase I have no idea.

<style type="css/text">div {  color: blue;}div:hover {  color: red;  font-weight: bold;  letter-spacing: 2px;}</style>

Hoped that helped.