OH NO! Broke my IE 6 Code

Voodoochilli · #1 Jul 11th, 2007, 15:11

Right, the other day I was trying to get my site voodoochilli.net html validated. In the process of getting the code to be valid, I have somehow messed up the navigation on IE 6!
I think I moved some <li> and <ul> tags about but I cant remeber which ones!

Heres the code:

Code: Select all

<ul>
  
      <li><a class="hide" href="http://www.voodoochilli.net/">Home</a>
    
          <!--[if lte IE 6]>
 <a href="http://www.voodoochilli.net/">Home
<table><tr><td>
<![endif]-->
          <ul>
            <li><a href="http://www.voodoochilli.net" title="Home">Home</a></li>
            <li><a href="http://www.voodoochilli.net/tutorials.php" title="Tutorial">Tutorials</a></li>
            <li><a href="http://www.voodoochilli.net/about.php" title="About">About</a></li>
            <li><a href="http://www.voodoochilli.net/contact.php" title="Contact">Contact</a></li>
            <li><a href="http://www.voodoochilli.net/tag-cloud.php" title="Popular Tags">Popular Tags</a></li>
             <li><a href="http://www.voodoochilli.net/reviews.php" title="Reviews">Reviews</a></li>
             <li><a href="http://www.voodoochilli.net/statistics.php" title="Statistics">Statistics</a></li>
        </ul>
    </li>
  </ul>
    <ul>
      <!--[if lte IE 6]>
</td></tr></table>
</a>
<![endif]-->
      <li>
       <a  class="hide" href="http://www.voodoochilli.net/showCategories.php">Artwork</a>
     <!--[if lte IE 6]>
 <a href="http://www.voodoochilli.net/showCategories.php">Artwork
<table><tr><td>
<![endif]-->
    <ul>
    
      <li><a title="Jewelry" href="http://www.voodoochilli.net/showImages.php?cat=Jewelry">Jewelry</a></li>
                    <li><a title="3D Graphics" href="http://www.voodoochilli.net/showImages.php?cat=3D Graphics">3D Graphics</a></li>
                    <li><a title="Fine Art" href="http://www.voodoochilli.net/showImages.php?cat=Fine Art">Fine Art</a></li>
                    <li><a title="Printmaking" href="http://www.voodoochilli.net/showImages.php?cat=Printmaking">Printmaking</a></li>
                    <li><a title="Graphic Design" href="http://www.voodoochilli.net/showImages.php?cat=Graphic Design">Graphic Design</a></li>
                    <li><a title="Illustration" href="http://www.voodoochilli.net/showImages.php?cat=Illustration">Illustration</a></li>
                    <li><a title="Photography" href="http://www.voodoochilli.net/showImages.php?cat=Photography">Photography</a></li>
                    <li><a title="Mixed Media" href="http://www.voodoochilli.net/showImages.php?cat=Mixed Media">Mixed Media</a></li>
                    <li><a title="Product Design" href="http://www.voodoochilli.net/showImages.php?cat=Product Design">Product Design</a></li>
                    <li><a title="Collage and Montage" href="http://www.voodoochilli.net/showImages.php?cat=Collage and Montage">Collage and Montage</a></li>
                    <li><a title="Drawing" href="http://www.voodoochilli.net/showImages.php?cat=Drawing">Drawing</a></li>
                    <li><a title="Digital Art" href="http://www.voodoochilli.net/showImages.php?cat=Digital Art">Digital Art</a></li>
                    <li><a title="3D Design and Crafts" href="http://www.voodoochilli.net/showImages.php?cat=3D Design and Crafts">3D Design and Crafts</a></li>
                    <li><a title="Web Design" href="http://www.voodoochilli.net/showImages.php?cat=Web Design">Web Design</a></li>
                    <li><a title="Ceramics" href="http://www.voodoochilli.net/showImages.php?cat=Ceramics">Ceramics</a></li>
                    </ul>
  </li>
</ul>

    
    <!--[if lte IE 6]>
</td></tr></table>
</a>
<![endif]-->
    


<ul>
  <li><a class="hide" href="http://www.voodoochilli.net/artists.php">Members</a><!--[if lte IE 6]>
 <a href="http://www.voodoochilli.net/artists.php">Members
<table><tr><td>
<![endif]-->
    <ul>
      <li><a href="http://www.voodoochilli.net/artists.php" title="Artist List">Artist List</a></li>
      <li><a href="http://www.voodoochilli.net/users/login.php" title="Login">Login</a></li>
      <li><a href="http://www.voodoochilli.net/register.php" title="Register">Register</a></li>
      <li><a href="http://www.voodoochilli.net/image-of-the-month.php" title="Image of the month">I.O.T.M</a></li>
      <li><a href="http://www.voodoochilli.net/users/threads.php" title="Forum">Forum</a></li>
      <li><a href="http://www.voodoochilli.net/users/forum_guest.php" title="Forum - Guest Login">Forum - Guest</a></li>
      <li><a href="http://www.voodoochilli.net/latest-blogs.php" title="Latest Blogs">Latest Blogs</a></li>    
      <li><a href="http://www.voodoochilli.net/site-faves.php" title="Recent Faves">+ Recent Faves</a></li>    
    </ul>
    <!--[if lte IE 6]>
</td></tr></table>
</a>
<![endif]-->

  </li>
</ul>
<ul><li><a class="hide" href="http://www.voodoochilli.net/site-search.php">Search</a>      <!--[if lte IE 6]>
 <a href="http://www.voodoochilli.net/site-search.php">Search
<table><tr><td>
<![endif]-->
      <ul>
        <li><a href="http://www.voodoochilli.net/site-search.php" title="Search">Site Search</a></li>
        <li><a href="http://www.voodoochilli.net/artists.php#search" title="Artist Search">Artist Search</a></li>
        <li><a href="image-search.php" title="Image Search">Image Search</a></li>
        <li><a href="http://www.voodoochilli.net/tag-cloud.php" title="Popular Tags">Popular Tags</a></li>
      </ul>
      <!--[if lte IE 6]>
</td></tr></table>
</a>
<![endif]-->
  </li>
</ul>
<ul>
  <li >
   <a class="hide" href="http://www.voodoochilli.net/donate.php">Donate</a>
        <!--[if lte IE 6]>
 <a href="http://www.voodoochilli.net/donate.php">Donate
<table><tr><td>
<![endif]-->
    <ul>
      <li><a href="http://www.voodoochilli.net/donate.php" title="Donate">Donate</a></li>
      <li><a href="http://www.voodoochilli.net/download-software.php" title="Downlaod Software">Download</a></li>
      </ul>

  </li>
</ul>

      <!--[if lte IE 6]>
</td></tr></table>
</a>
<![endif]-->

Any ideas?

Many thanks

Lchad · #2 Jul 11th, 2007, 15:33

That looks fine...

Is it the css that's messing it up?

Voodoochilli · #3 Jul 11th, 2007, 15:35

I dont think so as I havent changed the CSS in ages. Also it validates.

Lchad · #4 Jul 11th, 2007, 15:40

Ok.. I went to IE 6 and I think I see it.
In this code:

Code: Select all

<!--[if lte IE 6]>
</td></tr></table>
</a>
<![endif]-->
    


<ul>
  <li><a class="hide" href="http://www.voodoochilli.net/artists.php">Members</a><!--[if lte IE 6]>

Move the <ul> in red above the If statement

Code: Select all

<ul>
<!--[if lte IE 6]>
</td></tr></table>
</a>
<![endif]-->
    
  <li><a class="hide" href="http://www.voodoochilli.net/artists.php">Members</a><!--[if lte IE 6]>

If that fixes it you'll have to do it to Search and donate as well.

Voodoochilli · #5 Jul 11th, 2007, 15:50

No sorry, didnt work

Lchad · #6 Jul 11th, 2007, 15:57

ok.. well is this an extra if statement in red?

Code: Select all

  <ul> 
    <!--[if lte IE 6]>
</td></tr></table>
</a>
<![endif]-->
    


<ul>
  <li><a class="hide" href="http://www.voodoochilli.net/artists.php">Members</a>
<!--[if lte IE 6]>
 <a href="http://www.voodoochilli.net/artists.php">Members
<table><tr><td>
<![endif]-->
    <ul>

P.S. only working on the Members button at this point..

Voodoochilli · #7 Jul 11th, 2007, 17:13

nope :blowup:

If I remember correctly, the code was invalid when working. so i think looking at it logicaly isnt going to help...

I HATE IE 6!!!!!

thank you for helping so far.

1840dsgn · #8 Jul 11th, 2007, 20:41

Yea Voodoo I've got the same problem on one of my sites. IE6 adds space that you can't seem to get rid of when you use lists correctly. Or at least I haven't managed.

Sorry I can't help, just thought I'd share my anger and frustration!

Voodoochilli · #9 Jul 12th, 2007, 09:58

Yeah its annoying cant wait until all the old timers still running windows 95 decide to press the update button. Mind you IE 7 isnt perfect either.

pa007 · #10 Jul 12th, 2007, 10:02

But it is a massive improvement on its predecessor. It's like going from a rover 25 to ferarri(sp?). Remember even firefox has its problems.

Pete.

1840dsgn · #11 Jul 12th, 2007, 10:05

Wow...it deleted half my post when I clicked post!

Voodoo,

have just sorted my problem...see if the fix works for you.

My lists are nested like this:

Code: Select all

<ul>
     <li><a href="training_intro.html" class="current">Training</a></li>
     <li>
          <ul class="navul">
               <li><a class="current" href="nebosh.html">NEBOSH</a></li>
               <li><a href="iosh.html">IOSH</a></li>
               <li><a href="fsa.html">Fire Safety</a></li>
               <li><a href="bitesize.html">Bitesize</a></li>
          </ul>
      </li>                    
      <li><a href="consultancy_intro.html">Consultancy</a></li>
      <li><a href="partners.html">Partners</a></li>
</ul>

My problem was that there was about 10px of space between Training and NEBOSH. I fixed it by adding this code to the CSS. If your problems similar give it a try.

Code: Select all

li    {_height: 0;
}

welshstew · #12 Jul 12th, 2007, 10:07

Not sure it will help but I get an error on line 100. See attached.

Stew

Voodoochilli · #13 Jul 12th, 2007, 10:17

Its ok I got it sorted, but thatks. What did I do? Well I just randomly (well almost) moved tags around until it worked. Typical!

1840dsgn · #14 Jul 12th, 2007, 10:18

lol...thats the way to go!

glad you got it sorted.

Mike

moojoo · #15 Jul 12th, 2007, 17:15

The conditional comment needs to go in the <head> tags. Not the body. Didn't think you could use them like that. of course I have been wrong before.

Voodoochilli · #16 Jul 12th, 2007, 17:20

Yeah you can use them there. You can use them anywhere pretty much as its ignored by other browsers.The navigation code has to be in the body to work in this case.

moojoo · #17 Jul 12th, 2007, 19:17

Well that is handy to know =). Learn something every day!

		Webforumz.com > Main Forums > Design Your Website > Web Page Design
OH NO! Broke my IE 6 Code