Solved

IE6 nightmare

Posted on 2009-05-05
7
436 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
  • 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
How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

 

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

Maximize Your Threat Intelligence Reporting

Reporting is one of the most important and least talked about aspects of a world-class threat intelligence program. Here’s how to do it right.

Join & Write a Comment

When writing CSS, there are a few simple rules that will make your life easier.    1. Using ‘* {box-sizing:border-box;}’. Using this will wrap all your elements in a nice little compact box-model that will give you the width you want, like so... …
Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…

746 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

Need Help in Real-Time?

Connect with top rated Experts

16 Experts available now in Live!

Get 1:1 Help Now