[SOLVED] IE7 hover style not working

bjorntheart · #1 (**permalink**) Dec 5th, 2007, 07:21

Hi,

I've got a table with .png images in and loading styles from a css/main.css file.
I've successfully managed to change the background color of a div the images sits in when I hover over it with my mouse. This unfortunately only works in Firefox 2.0.0.11, but not in IE7.

How do I fix this?

Here's my css and htm code

CSS

Code: Select all

#styleImage {
     
    border:             1px solid grey;
    padding:            7px;
    margin:             5px;
    background-color:   #8DC4D8;

}

#styleImage:hover {
    
    background-color:   #E8E8E8;

}

HTM

Code: Select all

<table border="0" cellpadding="0" cellspacing="0" width="100%">
  <tr>
    <td align="center"><div id="styleImage"><a><img src="images/DOC.png" width="125" height="125" /></a></div></td>
    <td align="center"><div id="styleImage"><a><img src="images/HTML.png" width="125" height="125" /></a></div></td>
    <td align="center"><div id="styleImage"><a><img src="images/PDF.png" width="125" height="125" /></a></div></td>
    <td align="center"><div id="styleImage"><a><img src="images/RTF.png" width="125" height="125" /></a></div></td>
    <td align="center"><div id="styleImage"><a><img src="images/TXT.png" width="125" height="125" /></a></div></td>
  </tr>    
</table>

Thanx in advance

Monie · #2 (**permalink**) Dec 5th, 2007, 07:35

We need your image as well to see the "actual" result. Could you host it somewhere please?

bjorntheart · #3 (**permalink**) Dec 5th, 2007, 07:45

Can I zip and mail it to you instead?

Monie · #4 (**permalink**) Dec 5th, 2007, 07:50

Or you could just zipped it and attach them in your next post

Someone else might need the file in order to help you.
When you post reply, scroll down to the page and you could see the "Manage Attachment" browse your zip file and upload them.

bjorntheart · #5 (**permalink**) Dec 5th, 2007, 07:56

Thanx monie

Monie · #6 (**permalink**) Dec 5th, 2007, 08:15

Ahh... that probably your DOCTYPE problem!

What application(WYSIWYG) you used to code your page?
All you need to do is change your DOCTYPE from this:

Code: Select all

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

to this:

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

That should make your day

You could read THIS to better understand the DOCTYPE

bjorntheart · #7 (**permalink**) Dec 5th, 2007, 08:34

Yeah monie! You are a star. Works perfectly

I user Activestate Komodo Edit4.1, but inserted the DOCTYPE part through a template in Komodo Edit. Is there another free code editor that you can recommend. I do php, js, htm, css, c# etc programming

I've been doing web development for about a year now and I must say I still have a lot to learn.

monie, can you maybe point out some important key areas, such as DOCTYPE, that I need to look in to, that is absolutely essential for web development.

Thanx so much. I really appreciate it!

karinne · #8 (**permalink**) Dec 5th, 2007, 12:31

About DOCTYPE

Choosing the best Doctype for your website

About and EDITOR

HTML Editors

bjorntheart · #9 (**permalink**) Dec 5th, 2007, 12:40

karinne,

thank you very much. I'll check them out

Monie · #10 (**permalink**) Dec 6th, 2007, 01:40

And if you are trying to find some other great text editor out there, check out his thread!

LinkBacks (?) LinkBack to this Thread: http://www.webforumz.com/web-page-design/62935-solved-ie7-hover-style-not-working.htm
Posted By	For	Type	Date
IE7 hover style not working - CodingForums.com	This thread	Refback	Dec 5th, 2007 09:10

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
[SOLVED] magical ie6 hover states	AndrewChip	Web Page Design	1	Mar 31st, 2008 13:03
Why Style sheet isnt working	kaz	Web Page Design	19	Dec 21st, 2007 01:10
[SOLVED] styling a div with a link and hover	lister110	Web Page Design	6	Oct 31st, 2007 13:33
document.getElementById[objectID].style now working on Mozilla Browser	yogeshid	JavaScript Forum	1	May 25th, 2007 09:30
Div Style not working from External CSS	duel	Web Page Design	2	Mar 22nd, 2007 11:03

		Webforumz.com > Main Forums > Design Your Website > Web Page Design
[SOLVED] IE7 hover style not working