OH NO! Broke my IE 6 Code

[Voodoochilli]

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]

That looks fine...

Is it the css that's messing it up?

[Voodoochilli]

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

[Lchad]

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]

No sorry, didnt work

[Lchad]

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]

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]

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]

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]

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]

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]

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

Stew

[Voodoochilli]

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]

lol...thats the way to go!

glad you got it sorted.

Mike

[moojoo]

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]

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]

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

[Voodoochilli]

I love your picture by the way, on the bike. Reminds me of Napolian dynamite

[moojoo]

Originally Posted by Voodoochilli

I love your picture by the way, on the bike. Reminds me of Napolian dynamite

Because I am fancy.