Jump to content

Effect Works in Firefox but not IE


xProteuSx

Recommended Posts

I've got a navigation, that looks something like this:

 

<table width="1200px" cellspacing="0" cellpadding="1">

<tr style="height: 40px;">

    <td class="nav_home"><a href="index.html"><img src="images/btn_overlay.png" /></a></td>

    <td class="nav_gallery"><a href="money_gallery.html"><img src="images/btn_overlay.png" /></a></td>

        <td class="nav_articles"><a href="banknote_news.html"><img src="images/btn_overlay.png" /></a></td>

    </tr>

</table>

 

In the CSS, I have something like this:

 

td.nav_home

{

background-image: url(images/btn_home.png);

}

td.nav_home:hover

{

background-image: url(images/btns_home.png);

}

td.nav_gallery

{

background-image: url(images/btn_gallery.png);

}

td.nav_gallery:hover

{

background-image: url(images/btns_gallery.png);

}

td.nav_articles

{

background-image: url(images/btn_news.png);

}

td.nav_articles:hover

{

background-image: url(images/btns_news.png);

}

 

So, the navigation is in a table with buttons being images, and when a column is being mouse-overed then the image changes to another, giving the navigation the appearance of a mouseover effect.  Ofcourse, this works in every browser except for IE (God damn you microsoft!).

 

Any ideas on how to get it to work?

 

Cheers.

Link to comment
Share on other sites

I've got it figured out, I think:

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

 

Can anyone send me a link or enter some info about doctypes?  Just some general notes.  I have Googled it, obviously, but don't really understand the exact importance of this, and can't figure out why you need different doctypes, instead of having a default and all-encompassing one.

 

Cheers.

Link to comment
Share on other sites

Can anyone send me a link or enter some info about doctypes?

 

As time has gone by, the rules of how to display a web page have changed and become more consistent. In the beginning each browser decided on their own how to display the HTML provided. Rather than make everyone update every web site in the internet when new rules came out (good luck on that one) they just created the DOCTYPE syntax to tell the browser what version of HTML you are using.

 

In HTML 4 and XHTML 1, you have the choice of transitional (you can use old deprecated syntax) or strict (use of deprecated syntax is forbidden.) Also, if you declare that you are using HTML 4 or XHTML 1, it is assumed that you are using CSS 2 (though some web browsers will still accept CSS 3 features.) If no DOCTYPE is declared, I believe it defaults to HTML 4 transitional, but I'm not sure.

 

If you are new to HTML, just skip straight to learning HTML 5 and CSS 3. It's my understanding that HTML 5 does not officially support deprecated code, so there is no transitional version, but some browsers will display deprecated code anyways. In DreamWeaver, you should be able to tell it what version of HTML to use, and it should change the DOCTYPE for you.

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.