2 replies [Last post]
solbester
solbester's picture
Offline
newbie
Last seen: 10 years 48 weeks ago
Timezone: GMT-4
Joined: 2011-08-05
Posts: 1
Points: 2

Hey guys im having a really big problem with my site. It shows up fine in every browser except the old version of any IE. Can you guys help me out.

Here's what the page looks like in IE:
problem.jpg

Here's the HTML code:

<tr>
<td>
 
<div id="wrapper">
<div id="navMenu">
 
 
  <ul>
 
     <li><a href="home.html">Home</a>
       <ul>
 
       </ul> <!-- end inner UL -->
 
 
  </li> 
     <!-- end main LI -->
 
  </ul> <!-- end main UL -->
 
    <ul>
 
     <li><a href="aboutus.html">About</a>
 
       <ul>
 
       </ul> <!-- end inner UL -->
 
 
  </li> 
     <!-- end main LI -->
 
    </ul> <!-- end main UL -->
 
    <ul>
 
     <li><a href="aboutvictoria.html">Victoria</a>
 
  <ul>
 
    <li><a href="victoriastilwellarticle.html">Articles</a></li>
 
    <li><a href="philosophy.html">Philosophy</a></li>
 
    <li><a href="vspdt.html">VSPDT</a></li>
</ul> <!-- end inner UL -->
 
 
  </li> 
     <!-- end main LI -->
 
    </ul> <!-- end main UL -->
 
      <ul>
 
     <li><a href="photos.html">Photos</a>
 
  <ul>
  </ul> <!-- end inner UL -->
 
 
  </li> 
     <!-- end main LI -->
 
      </ul> <!-- end main UL -->
 
      <ul>
 
     <li><a href="links.html">Links</a>
 
  <ul>
  </ul> <!-- end inner UL -->
 
 
  </li> 
     <!-- end main LI -->
 
      </ul> <!-- end main UL -->
 
      <ul>
 
     <li><a href="trainingprograms.html">Training</a>
 
  <ul>
 
  <li><a href="trainingmethods.html">Methods</a></li>
 
    <li><a href="whyreinforcement.html">Positive(+R)</a></li>
 
    <li><a href="class.html">C.L.A.S.S</a></li>
 
  </ul> <!-- end inner UL -->
 
 
  </li> 
     <!-- end main LI -->
 
      </ul> <!-- end main UL -->
 
      <ul>
 
     <li><a href="http://dynamitedogtraining.blogspot.com/">Blog</a>
 
  <ul>
  </ul> <!-- end inner UL -->
 
 
  </li> 
     <!-- end main LI -->
 
      </ul> <!-- end main UL -->
 
      <ul>
 
     <li><a href="contact.html">Contact</a>
 
  <ul>
  </ul> <!-- end inner UL -->
 
 
  </li> 
     <!-- end main LI -->
 
      </ul> <!-- end main UL -->
 
 
 
    <br class="clearFloat" />
 
 
 </div> <!-- end navMenu -->
 </div> 
<!--end wrapper -->
 
 </td>
 </tr>

And here's the CSS code:

#navMenu {
    margin:0;
    width:auto;
    background-image: url(images/Home_top_06.jpg);
    padding:0;
}
 
  #navMenu ul {
    margin:0;
    padding:0;
    line-height:30px;
    background-color: #333;
 
 }
 
  #navMenu li {
    margin:0;
    padding:0;
    list-style:none;
    float:left;
    position:relative;    
}
 
  #navMenu ul li a {
    text-align:center;
    height:36px;
    width:70px;
    display:block;
    font-family:"Comic Sans MS", cursive;
    text-decoration:none;
    color:#FFF;
    text-shadow:0;
    font-size: 15px;
    font-variant: normal;
}
 
  #navMenu ul ul {
    visibility:hidden;
    top:32px;
    width: 120px;
    font-style: italic;
    position: absolute;
    margin-left: -20px;
    text-indent: 9px;
    text-align: center;
 }
 
  #navMenu ul li:hover ul {
    visibility:visible;
    z-index:9999;
 
 }
 
  /**********************************************/
 
  /*sets top level hover color*/
 
  #navMenu li:hover {
    font-weight: bold;
    font-style: italic;
 }
 
  /*sets link items hover color and background*/
 
  #navMenu ul li:hover ul li a:hover {
    color:#000;
    background-color: #E71923;
    width: 120px;
 }
 
  /* Changes text color on hover for main menu hover*/
 
  #navMenu a:hover {
    color:#FFF;
 } 
 
 /* Contains the Float */
 
 .clearFloat {
    clear:both; 
    margin:0;
    padding:0;
 }
 
#navMenu #holder ul li{
    display:inline;
    float:left;
    clear:left;
}

Please if you guys can help it would be awesome thank you

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 7 years 26 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

It would be awesome if you

It would be awesome if you could give a brief written explanation of what is happening, it's not hugely clear from the SC, you should really always explain what is happening even if an image or site link is available.

One thing to try though is remove the visibility hidden on the ul ul the usual approach is to use the offset to shift off screen i.e left: -999em;

Also when you say older browsers you must define older, do you mean IE6 ? in which case no the menu dropdown won't work as IE6 doesn't activate hover on anything but anchors, you have to have a scripted solution for IE6.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

thepineapplehead
thepineapplehead's picture
Offline
Moderator
Last seen: 10 weeks 3 days ago
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9683
Points: 819

And it would be super-awesome

And it would be super-awesome if you gave us ALL the code.

Verschwindende wrote:
  • CSS doesn't make pies