Solved

IE6 nightmare

Posted on 2009-05-05
7
442 Views
Last Modified: 2012-05-06
Left menu is OK in other browsers but IE6 is throwing wobbly with the left menu.

Each line is having extra space added to the bottom. Setting padding & margin to 0px to both the li and a tags makes no difference.

For some reason "Product by knowledge" has the correct space.

http://dev.nationalflooring.co.uk/about-us.html

Can you point me in the right direction?

Ta,

Luv2.
0
Comment
Question by:Luv2Muff
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 3
7 Comments
 
LVL 16

Expert Comment

by:hankknight
ID: 24303288
Why do you keep posting this same question?
0
 
LVL 16

Accepted Solution

by:
hankknight earned 500 total points
ID: 24303337
Add this to your CSS:


#sub_menu ul {
  list-style-position: outside; 
  list-style-type: none;
}
 
#sub_menu li {
  margin: 0;
  padding: 0;
  border: 1px solid #D0D1D3;
}

Open in new window

0
 
LVL 16

Expert Comment

by:hankknight
ID: 24303348
I have tested this and it works:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<!--
 
	This website is powered by TYPOlight webCMS :: TYPOlight is licensed under GNU/LGPL
	Copyright ©2005-2009 by Leo Feyer :: Extensions are copyright of their respective owners
	Visit the project website at http://www.typolight.org for more information
 
//-->
<head>
<base href="http://dev.nationalflooring.co.uk/"></base>
<title>National Flooring Company - About us</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="description" content="The National Flooring Company is a recognised leader in the supply and installation of resin based flooring systems for every type of industry. Our experience has enabled us to accumulate a comprehensive understanding of resin flooring systems that is second to none." />
<meta name="keywords" content="" />
<meta name="robots" content="index,follow" />
<style type="text/css" media="screen">
<!--/*--><![CDATA[/*><!--*/
* html body { text-align:center; }
#wrapper { width:960px; margin:0 auto; }
#header { height:130px; }
#left { width:230px; }
#main {  margin-left:230px; }
#footer { height:30px; }
/*]]>*/-->
</style>
<link rel="stylesheet" href="system/typolight.css" type="text/css" media="screen" />
<!--[if lte IE 7]><link rel="stylesheet" href="system/iefixes.css" type="text/css" media="screen" /><![endif]-->
<link rel="stylesheet" href="plugins/slimbox/css/slimbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="plugins/mootools/mootools.js"></script>
<script type="text/javascript" src="plugins/slimbox/js/slimbox.js"></script>
<meta http-equiv="imagetoolbar" content="no" />
<meta name="viewport" content="width=device-width, initial-scale = 1, user-scalable = no, minimum-scale = 1, maximum-scale = 1" />
<link rel="stylesheet" type="text/css" href="tl_files/css/reset.css" media="screen" />
<link rel="stylesheet" type="text/css" href="tl_files/css/typography.css" media="screen" />
<link rel="stylesheet" type="text/css" href="tl_files/css/forms.css" media="screen" />
<link rel="stylesheet" type="text/css" href="tl_files/css/navigation.css" media="screen" />
<link rel="stylesheet" type="text/css" href="tl_files/css/news.css" media="screen" />
<link rel="stylesheet" type="text/css" href="tl_files/css/custom.css" media="screen" />
     <!--[if IE]>
	  <link rel="stylesheet" type="text/css" href="tl_files/css/ie.css" media="screen" />
	<![endif]-->
     <!--[if IE 7]>
	  <link rel="stylesheet" type="text/css" href="tl_files/css/ie-7-hacks.css" media="screen" />
	<![endif]-->
	<!--[if lte IE 7]>
	  <link rel="stylesheet" type="text/css" href="tl_files/css/ie-6lte-hacks.css" media="screen" />
	<style type="text/css">
	#sub_menu ul {
	  list-style-position: outside; 
	  list-style-type: none;
	}
	#sub_menu li {
	  margin: 0;
	  padding: 0;
	  border: 1px solid #D0D1D3;
	}
</style>
	<![endif]-->
<script type="text/javascript" src="tl_files/js/external.js"></script>
</head>
 
<body id="top">
<div id="wrapper">
 
<div id="header">
<div class="inside">
 
<div id="logo">
	<a href="/" title="National Flooring - Floors for Industry"><img src="tl_files/images/nf-logo.png" alt="National Flooring - Floors for Industry" /></a>
</div>
 
<div id="menu-top">
	<p><a href="sitemap.html">Sitemap</a><span class="red">|</span><a href="/privacy-and-legal.html">Privacy &amp; legal policy</a><span class="red">|</span><a href="#">Client login</a></p>
</div>
	  
<div id="tel"><p>+44 (0) 1778 343670</p></div>
 
 
<!-- indexer::stop -->
<div class="mod_navigation block" id="main_menu">
 
<a href="about-us.html#skipNavigation_4" class="invisible" title="Skip navigation"></a>
 
<ul class="level_1">
<li class="first"><a href="home.html" title="National Flooring Company" class="first" onclick="this.blur();">Home</a></li>
<li class="active"><a href="about-us.html" title="About us" class="active">About us</a></li>
<li><a href="services.html" title="Services" onclick="this.blur();">Services</a></li>
<li><a href="product-range.html" title="Product range" onclick="this.blur();">Product range</a></li>
<li><a href="sectors.html" title="Sectors" onclick="this.blur();">Sectors</a></li>
<li><a href="news.html" title="News" onclick="this.blur();">News</a></li>
<li class="last"><a href="contact-us.html" title="Contact us" class="last" onclick="this.blur();">Contact us</a></li>
</ul>
 
<a id="skipNavigation_4" class="invisible" title="Skip navigation"></a>
 
</div>
<!-- indexer::continue -->
 
 
<!-- indexer::stop -->
<div class="mod_breadcrumb block">
 
<a href="home.html" title="National Flooring Company">Site root</a> &#62; 
<span class="active">About us</span>
 
</div>
<!-- indexer::continue -->
 
</div>
</div>
 
<div id="container">
 
<div id="left">
<div class="inside">
 
<!-- indexer::stop -->
 
<div class="mod_navigation block" id="sub_menu">
 
<h2>About us</h2>
 
<a href="about-us.html#skipNavigation_14" class="invisible" title="Skip navigation"></a>
 
<ul class="level_1">
<li class="first"><a href="what-we-do.html" title="What we do" class="first" onclick="this.blur();">What we do</a></li>
<li><a href="service-with-integrity.html" title="Service with integrity" onclick="this.blur();">Service with integrity</a></li>
<li class="submenu"><a href="product-by-knowledge.html" title="Product by knowledge" class="submenu" onclick="this.blur();">Product by knowledge</a>
<ul class="level_2">
<li class="first"><a href="why-mma.html" title="Why MMA?" class="first" onclick="this.blur();">Why MMA?</a></li>
<li><a href="why-degafloor.html" title="Why Degafloor?" onclick="this.blur();">Why Degafloor?</a></li>
<li class="last"><a href="knowledge-centre.html" title="Knowledge Centre" class="last" onclick="this.blur();">Knowledge Centre</a></li>
</ul>
</li>
<li><a href="health-and-safety.html" title="Health and Safety" onclick="this.blur();">Health and Safety</a></li>
<li><a href="environmental.html" title="Environmental" onclick="this.blur();">Environmental</a></li>
<li><a href="training.html" title="Training" onclick="this.blur();">Training</a></li>
<li class="last"><a href="customer-service-by-design.html" title="Customer service by design" class="last" onclick="this.blur();">Customer service by design</a></li>
</ul>
 
<a id="skipNavigation_14" class="invisible" title="Skip navigation"></a>
 
</div>
<!-- indexer::continue -->
<!-- indexer::stop -->
<div class="mod_contentbox block" id="extJs_module_7">
 
<div class="mod_contentbox_inside block">
<div class="mod_box_items block bg_white first last" >
<div class="ce_text">
 
 
<div id="ferfa">
     
     	<a href="http://www.ferfa.org.uk/default.php?cmd=260"><img src="tl_files/images/ferfa_logo.jpg" alt="Members of The Resin Flooring Association Logo" /></a>
<p class="last" style="font-weight:normal">Members of The Resin<br />Flooring Association</p>
</div>
 
</div>
</div>
</div>
 
</div>
<!-- indexer::continue --> 
</div>
</div>
 
<div id="main">
<div class="inside">
 
<div class="mod_article block" id="main-image19">
 
<div class="ce_text block" id="extJs_content_18">
 
<div><img title="tl_files/images/about/about-us.jpg" src="tl_files/images/about/about-us.jpg" alt="tl_files/images/about/about-us.jpg" width="710" height="269" /></div>
</div>
 
</div>
 
</div>
 
<div class="custom">
 
<div id="Main_Left">
<div class="inside">
 
<div class="mod_article block" id="main-left18">
 
<div class="ce_text block" id="extJs_content_17">
 
<h1>Leading the future of flooring&</h1>
 
<p><strong>The National Flooring Company is a recognised leader in the supply and installation of resin based flooring systems for every type of industry. Our experience has enabled us to accumulate a comprehensive understanding of resin flooring systems that is second to none.</strong></p>
 
<p>Within our business we have access to unrivalled flooring system expertise and this, coupled with highly trained and experienced installation teams, allows us to offer market leading flooring services, from project consultation through to installation.</p>
 
<p>From factories to nightclubs, we have become a trusted authority in resin flooring solutions that work intensely in every kind of environment. Whether your requirement is a simple repair or a major industrial flooring installation, the outstanding quality, proficiency, value for money and service we provide never waivers.</p>
 
<p>With each and every project we deliver unrivalled installation expertise coupled with the highest quality materials.</p>
 
</div>
 
</div>
 
</div>
</div>
 
<div id="Main_Right">
<div class="inside">
<!-- indexer::stop -->
<div class="mod_contentbox block" id="extJs_module_8">
 
<div class="mod_contentbox_inside block">
<div class="mod_box_items block first"  style="margin-bottom:20px;" >
<div class="ce_text">
<h2>Contact us</h2>
 
 
<div class="box_inner">
<p>We would be delighted to answer any questions you may have.</p>
<p class="last">For a prompt response please use our <a href="#">enquiry form</a>.</p>
</div>
 
</div>
</div>
<div class="mod_box_items block"  style="margin-bottom:20px; margin-bottom:20px;" >
<div class="ce_text">
<h2>Corporate brochure</h2>
 
 
<div class="box_inner">
<p><a class="new-window" rel="nofollow" href="tl_files/resources/nf-corporate-brochure.pdf"><img style="margin:5px 0px 10px 0px;" title="National Flooring brochure" src="tl_files/images/about/brochure.jpg" alt="National Flooring brochure" /></a></p>
<p class="last">Download our<br /><a class="pdf new-window" rel="nofollow" href="tl_files/resources/nf-corporate-brochure.pdf">corporate brochure</a>.</p>
</div>
 
</div>
</div>
<div class="mod_box_items block last"  style="margin-bottom:20px; margin-bottom:20px; margin-bottom:20px;" >
<div class="ce_text">
<h2>Product guide</h2>
 
 
<div class="box_inner">
<div style="float:left"><a class="new-window" rel="nofollow" href="tl_files/resources/product-guide.pdf"><img style="margin:5px 10px 0px 0px" title="National Flooring guide" src="tl_files/images/about/guide.jpg" alt="National Flooring guide" width="64" height="91" /></a></div>
<p class="last">Download our<br /><a class="pdf new-window" rel="nofollow" href="tl_files/resources/product-guide.pdf">product guide</a>.</p>
<div style="clear:both"><!--&nbsp;--></div>
</div>
 
</div>
</div>
</div>
 
</div>
<!-- indexer::continue -->
</div>
</div>
 
</div>
 
 
<div id="test">
<div class="inside">
 
</div>
</div>
 
<div id="clear"></div>
</div>
 
</div>
 
<div id="footer">
<div class="inside">
 
<div id="credit">
<p class="credit">© National Flooring 2008 | Website design by<img src="tl_files/images/tf-icon.png" alt="Titman Firth Icon" style="padding:0px 5px 0px 5px; margin-left:0px" /><a href="http://www.titmanfirth.com/" class="new-window external">Titman Firth</a></p>
</div>     
<p class="credit">Registered office: The National Flooring Company Limited, 2 Pavillion Court, Pavillion Drive, Northampton Business Park, Brackmills, Northampton NN4 7SG. Registered in England No. 3059829</p> 
</div>
</div>
 
<!-- indexer::stop -->
<img src="http://dev.nationalflooring.co.uk/cron.php" alt="" class="invisible" />
<!-- indexer::continue -->
 
</div>
</body>
</html>

Open in new window

0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:Luv2Muff
ID: 24303389
@hankknight - As far as I can see this is the 1st time I have asked a question relating to the left menu, maybe the fact that I left the title as the same confused you? If so apologies!!
0
 

Author Closing Comment

by:Luv2Muff
ID: 31577951
Perfect worked a treat!!

Thanks,

Luv2.
0
 
LVL 16

Expert Comment

by:hankknight
ID: 24303408
@Luv2Muff, thank you for the explanation.  The reason I asked is because sometimes experts ignore questions after reading them if they don't think they can answer them.  So if you use the same title, it is more likely to be ignored.

Did you test my solution?
0
 

Author Comment

by:Luv2Muff
ID: 24303413
Will ensure they are different in future.

Yep, solution tested and works a treat.

Thanks again,

Luv2.

0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

So you have coded your own WordPress plugin and now you want to allow users to upload images to a folder in the plugin folder rather than the default media location? Follow along and this article will show you how to do just that!
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
In this Micro Tutorial viewers will learn how to create a CSS image sprite (In a later tutorial, viewers will learn how to use CSS and HTML to create a navigation menu using this sprite) Open a new Photoshop document with a width of (Icon width)x(N…
In this tutorial viewers will learn how to customize the background color and font color of highlighted text using the ::selection element in CSS Begin by defining the selected text as an element in CSS by typing "::selection": Style the ::selection…

707 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question