change background in div

[Cezary]

Hello.

I have this code below and want to change background, but this works only in
IE5.x. Why ?

<div onmouseover="this.className='change'" onmouseout="this.className=''"
style="width:100%;display:inline" class="txt11 nopad">

<div style="width:5%">....</div>
<div style="width:43%">....</div>
....
</div>

= css =
..txt11 {font-size:11px}
..nopad { padding:0; margin:0}
..change {border-top:1px solid gray; border-bottom:1px solid gray;
border-left:1px solid gray; border-right:1px solid gray; background:#eeeeee}

Any suggestions appreciated.

Greets,
Cezary

[Steve Pugh]

"Cezary" <ce*****@imail.net.pl> wrote:

I have this code below and want to change background, but this works only in
IE5.x. Why ?
It works more or less the same in IE5.x, IE6, Opera 7.5 and Mozilla
1.6. So which browsers is it not working in for you?
<div onmouseover="this.className='change'" onmouseout="this.className=''"
style="width:100%;display:inline" class="txt11 nopad">
...
</div>
So, when the page first loads the div applies the styles belonging to
both text11 and nopad. Then when the mouse moves over the div the
styles belonging to change are applied instead. Then when the mouse
moves away from the div no styles at all are applied. That's what I
see in all the above browsers.

There are differences between IE5 and Mozilla; IE6 and Opera can
behave like either depending on whether quirks or standards mode are
triggered.
.txt11 {font-size:11px}
.nopad { padding:0; margin:0}
.change {border-top:1px solid gray; border-bottom:1px solid gray;
border-left:1px solid gray; border-right:1px solid gray; background:#eeeeee}

Why over-specify the border like that? border: 1px solid gray; is much
shorter when all four borders are the same.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <st***@pugh.net> <http://steve.pugh.net/>