input type=image + changing image

Hi

Pasrt of HTML -

<div class='button'><input type='image'
src='/images/check1.jpg'></input></div>

Part of CSS -

..button {background-image: url(/images/check1.jpg); background-repeat:
no-repeat;}
..button:hover {background-image: url(/images/check2.jpg); background-repeat:
no-repeat;}

Is there something I'm missing? Image should change on mouseover. Image
doesn't change. Using IE7 and FF.

Regards
John

re: input type=image + changing image

John wrote:Very much so
No it shouldn't. The CSS styles the *background* of the DIV but your
have a input of type image that is in the *foreground* that covers up
your DIV's background image....

BTW MSIE will only support :hover pseudo class on A elements with an
HREF attribute.


--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

re: input type=image + changing image

"John" <john1949@yahoo.comwrote in
news:tqydnUFoNOLG8XTbnZ2dnUVZ8sKlnZ2d@eclipse.net. uk:

you're changing the DIV, not the INPUT element.

re: input type=image + changing image

John wrote:Invalid HTML markup. <inputdoes not get </inputto close it. It is
forbidden.


--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)

re: input type=image + changing image

Jim Moe <jmm-list.AXSPAMGN@sohnen-moe.comwrote in news:RN-dnUtKL-
61C3TbnZ2dnUVZ_qrinZ2d@giganews.com:
It's invalid HTML, but it's valid XHTML though its generally self-closing,
a-la

<input type="image" src="/images/check1.jpg" />

instead of using </input>

re: input type=image + changing image

Good Man wrote:The OP explicitly said "HTML".

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)

re: input type=image + changing image

John wrote:No it shouldn't. The background image of the div containing the input
element should. But the input element is sitting on top of the
background and blocking your view of the background image.

By the way, there is no </inputtag in HTML.

re: input type=image + changing image

Scripsit John:
That's pointless and inaccessible. Turn image display off in your browser
(if you don't know how to do that, it's time to learn) and test the page to
see this.
Yes. You're missing
<input type="submit" value="..." class="submit">
which is a great improvement over all expensive plastic imitations. The
class attribute is here just to help in styling, due to lack of support to
attribute selectors in IE 6 and older.

(And you're missing the information that jpeg format should normally be used
for photos only, and photos aren't usually suitable for use as button images
or as backgrounds.)

To style it so that it changes on mouseover, you would write

..submit:hover { ... }

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

re: input type=image + changing image

"John" <john1949@yahoo.comwrote in message
news:tqydnUFoNOLG8XTbnZ2dnUVZ8sKlnZ2d@eclipse.net. uk...Many thanks for the replies. All is now well.
My mistake - I said HTML when I meant XHTML.

Regards
John