DIV-Roll Over and change colour

Forum Moderators: not2easy

Message Too Old, No Replies

DIV-Roll Over and change colour

PatrickKerby

3:05 am on Jun 22, 2004 (gmt 0)

Hey, Im trying to create a box which when hovered over will have the background colour change... what i've done here makes sense to me... any reason it doesn't work?

DIV {
font-size: 10px;
font-family: arial .......
color: #000000;
text-align: center;
}
#Register {
height: 14px; width: 142px;
background: #C8CCD5;
padding-top: 2px;
padding-bottom: 2px;
border: solid;
border-width: 1px;
border-color: #5A6781;
}
#Register:hover {
height: 14px; width: 142px;
background: #FFFFFF;
padding-top: 2px;
padding-bottom: 2px;
border: solid;
border-width: 1px;
border-color: #5A6781;
}

D_Blackwell

4:35 am on Jun 22, 2004 (gmt 0)

Doesn't work on what browser? It works fine on Firefox. It doesn't work on IE 6, because IE won't accept :hover with anything but a:hover.

I tweaked the code a bit. You have some extra stuff, and some long winded stuff. #Register:hover will inherit both the padding and border. These can both be shorthanded as well.

I've been working with this same issue, and this source whatever:hover [xs4all.nl] has been very helpful. Thanks to Dr. Doc for sending me to it.

I see lots of px. Would em or % be useful to you?

PatrickKerby

5:52 am on Jun 22, 2004 (gmt 0)

Yep, I'm using IE6.
Thanks for the tips, Im just starting to get proficient with CSS, getting to know it's ins and outs... but still learning more and more on how to optimize my code.
Thanks!

and yes... I really do need to start testing in more browsers.. as I'm just starting to do lots more webdesign work compared to what i've been used to.
Thanks again

benv

9:25 am on Jun 22, 2004 (gmt 0)

this is not working on IE5 mac

do many developers test on Mac OSX and OS9?