Author Topic: IE8 has lines between tabs that disappear on hover or page scroll  (Read 900 times)

0 Members and 1 Guest are viewing this topic.

Offline sKunKbadTopic starter

  • Devotee
  • Posts: 1,477
  • Gender: Male
    • View Profile
    • Brian's Web Design - Temecula
IE8 has lines between tabs that disappear on hover or page scroll
« on: September 09, 2010, 01:14:03 PM »
Posting here in HTML, but don't know what is causing this display issue in IE8. Live page is located at http://www.tv-sewingcenter.com It only seems to happen on the home page.

I've tested this on a few computers and multiple browsers, so it seems that it is only IE8. I don't have compatibility mode on, but I don't consider this a fix.

I've attached an image that shows the display problem. Little vertical lines between menu tabs. If I hover over the tabs, then the lines go away. If I scroll down the page and then come back, the lines go away. If I go to another page and then come back, the lines go away.

Any ideas?

[attachment deleted by admin]
Brian's Web Design - Temecula

Freedom is only available through death.

Offline sKunKbadTopic starter

  • Devotee
  • Posts: 1,477
  • Gender: Male
    • View Profile
    • Brian's Web Design - Temecula
Re: IE8 has lines between tabs that disappear on hover or page scroll
« Reply #1 on: September 09, 2010, 01:29:08 PM »
More info: seems like this is only happening in the Windows 7 x64 IE8.
Brian's Web Design - Temecula

Freedom is only available through death.

Offline fortnox007

  • Devotee
  • Posts: 777
  • Gender: Female
  • mooOO
    • View Profile
Re: IE8 has lines between tabs that disappear on hover or page scroll
« Reply #2 on: September 09, 2010, 11:13:52 PM »
replace your odd doctype you have with this one:

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

Hopefully that works
"Give a monkey a banana and you feed him for a day; teach a monkey to rob banks and he will feed you for a lifetime."
http://www.addedbytes.com/writing-secure-php/writing-secure-php-1/
<br />
error_reporting(E_ALL);
ini_set("display_errors", 1);

Offline sKunKbadTopic starter

  • Devotee
  • Posts: 1,477
  • Gender: Male
    • View Profile
    • Brian's Web Design - Temecula
Re: IE8 has lines between tabs that disappear on hover or page scroll
« Reply #3 on: September 10, 2010, 03:39:25 AM »
replace your odd doctype you have with this one:

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

Hopefully that works

I had tried different doctypes, and stripped all extra code out. Narrowed it down to what you see here:

http://www.tv-sewingcenter.com/test.html

My doctype is the new HTML5 doctype, which supposedly works just fine, and it didn't make a difference what I changed the doctype to, so that wasn't the problem. In the end, I just applied a negative margin to the .tab-on and .tab-off divs, and that cleared things up for IE8 x64. Seems like a bit of a hack, but then I guess that's what IE is all about.
Brian's Web Design - Temecula

Freedom is only available through death.

Offline haku

  • Guru
  • Freak!
  • *
  • Posts: 5,707
  • Old Man
    • View Profile
Re: IE8 has lines between tabs that disappear on hover or page scroll
« Reply #4 on: September 12, 2010, 09:46:37 AM »
None of the current versions of IE (up to 8) support HTML 5. IE9 supposedly will.