Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jul 2011
    Posts
    9
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Strange Side Menu Behavior

    I have cleaned up my web design and code a lot and have addressed most of the glitches.

    In IE 8 and IE 7 the side menu gets scrunched over? Just 1 list item only the text, moves right.
    Strange Side Menu Behavior-screen-shot-2011-07-29-12.50.28-am.png

    http://furniturelandnewjersey.com/contact.html

    This is the CSS. It meets W3C validation.

    Code:
    <!--
    #menuheader {
    position : relative;
    margin-left : 10px;
    marhin-right : 10px;
    display : block;
    width : 1000px;
    height : 35px;
    margin : 0;
    padding : 0;
    font : 12px "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, Verdana, sans-serif;
    line-height : 35px;
    text-decoration : none;
    font-family : "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, Verdana, sans-serif;
    }
    #menuheader-roundrect, #menuheader-fill {
    display : block;
    position : absolute;
    width : 900px;
    height : 35px;
    top : 0;
    left : 0;
    z-index : 2;
    }
    #menuheader #navlists {
    position : relative;
    display : block;
    margin : 0;
    padding : 0;
    }
    #menuheader #navlists li {
    display : inline;
    text-align : center;
    color : white;
    }
    #menuheader #navlists li a {
    float : left;
    height : 35px;
    overflow : hidden;
    background : url(http://www.furniturelandnewjersey.com/images/top_navigation.png) no-repeat;
    color : white;
    text-align : center;
    width : 100px;
    background-position : 100% 0%;
    outline : none;
    text-decoration : none;
    }
    #menuheader #navlists li a:link {
    cursor : pointer;
    }
    #menuheader #navlists li#item-first a {
    background-position : 0% 0%;
    }
    #menuheader #navlists li#item-first a.before {
    background-position : 0% -35px;
    }
    #menuheader #navlists li#item-first a:hover {
    background-position : 0% -70px;
    }
    #menuheader #navlists li#item-first a:active {
    background-position : 0% -105px;
    }
    #menuheader #navlists li a.before {
    background-position : 100% -35px;
    }
    #menuheader #navlists li a:hover {
    background-position : 100% -70px;
    }
    #menuheader #navlists li a:active {
    background-position : 100% -105px;
    }
    #menuheader #navlists li#item-last a {
    background-position : -100px 0%;
    }
    #menuheader #navlists li#item-last a.before {
    background-position : -100px -35px;
    }
    #menuheader #navlists li#item-last a:hover {
    background-position : -100px -70px;
    }
    #menuheader #navlists li#item-last a:active {
    background-position : -100px -105px;
    }
    #menuheader #navlists li a.current {
    background-position : 100% -140px;
    }
    #menuheader #navlists li#item-last a.current {
    background-position : -100px -140px;
    }
    hr {
    color : #ccc;
    background-color : #ccc;
    }
    .container footer p {
    font-family : Verdana, Geneva, sans-serif;
    font-size : 12px;
    font-style : normal;
    color : #999;
    text-align : center;
    }
    ul, ol, dl {
    padding : 0;
    margin : 0;
    }
    h1, h2, h3, h4, h5, h6 {
    margin-top : 0;
    padding-right : 15px;
    padding-left : 15px;
    font-family : Verdana;
    color : #333333;
    text-align : left;
    font-size : 20px;
    }
    p {
    margin-top : 0;
    padding-right : 15px;
    padding-left : 15px;
    font-family : Verdana;
    color : #666666;
    text-align : left;
    font-size : 16px;
    }
    a img {
    border : none;
    }
    a:link {
    color : #42413c;
    text-align : left;
    }
    a:visited {
    color : #42413c;
    text-decoration : underline;
    }
    a:hover, a:active {
    text-decoration : none;
    color : #c71f2e;
    }
    a {
    outline : none;
    }
    .container {
    width : 960px;
    background : #ffffff;
    margin : 0 auto;
    }
    .mainbody {
    width : 1000px;
    background : #ffffff;
    margin : 0 auto;
    }
    .content {
    padding : 10px 0;
    width : 780px;
    float : right;
    }
    .content ul, .content ol {
    padding : 0 15px 15px 40px;
    }
    nav ul {
    list-style : none;
    border-top : 0 solid #666;
    margin-top : 5px;
    margin-bottom : 15px;
    text-indent : 15px;
    font-size : 14px;
    font-family : Verdana, Geneva, sans-serif;
    }
    nav ul li {
    border-bottom : 0 solid #666;
    }
    nav ul a, nav ul a:visited {
    padding : 5px 5px 5px 15px;
    display : block;
    width : 160px;
    text-decoration : none;
    background : #ffffff;
    }
    nav ul a:hover, nav ul a:active {
    background : #eeeeee;
    }
    footer {
    padding : 0 0;
    background : #fff;
    position : relative;
    clear : both;
    }
    header, section, footer, aside, nav, article, figure {
    display : block;
    text-align : center;
    float : left;
    font-family : Verdana, Arial, Helvetica, sans-serif;
    color : #666666;
    display: inline;
    }
    .sidebar nav aside hr {
    	width : 183px;
    	align : left;
    	
    }
    .sidebar nav aside table {
    	width : 183px;
    	border: 0;
    	cellspacing: 0;
    }
    .sidebar nav aside table img {
    	border: 0;
    	
    }
    .container article table {
    border-left-width : 2px;
    border-left-style : solid;
    border-left-color : #c71f2e;
    margin-left : -22px;
    width: 780px;
    cellpadding:0;
    }
    .container footer table {
    border-top-width : 1px;
    border-top-style : solid;
    border-right-style : none;
    border-bottom-style : none;
    border-left-style : none;
    border-top-color : #999;
    border-collapse : collapse;
    font-family : Verdana, Geneva, sans-serif;
    font-size : 14px;
    font-style : normal;
    line-height : normal;
    color : #999;
    padding-left : 50px;
    padding-top : 0;
    text-align : left;
    width : 998px;
    }
    .container footer p1 a:hover, .container footer p1 a:active {
    background : #fff;
    color : #c71f2e;
    text-align : center;
    font-size : 13px;
    text-decoration : none;
    }
    .container footer p1 {
    font-family : Verdana, Geneva, sans-serif;
    font-size : 13px;
    color : #666;
    text-align : center;
    text-decoration : none;
    }-->
    The html
    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
    <meta name="keywords"  content="furniture nj, furniture, furniture store nj, funiture land,furniture nj, sofas, modern furniture, funiture store in nj"/> 
    <meta name="description" content="furniture nj, furniture store nj, furniture outlet nj, furniture warehouse nj, furniture new jersey, furniture store in nj, furniture"/>
    <link rel="shortcut icon" href="favicon.ico" />
    <link rel="stylesheet" type="text/css" href="stylesheet.css" />
    <style type="text/css">
    </style>
    <!--[if lt IE 9]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <!--[if IE]>
    <style type="text/css"> 
    Content, section { zoom: 1;}
    </style>
    <![endif]-->
    <title>Furniture Land: NJ's Discount Furniture Store</title>
    </head>
    
    <body>
    
    <div class="container">
      <header>
        <a href="http://www.furniturelandnewjersey.com"><img src="http://www.furniturelandnewjersey.com/image/images/logo3.png" alt="Furniture Store NJ" width="1000" height="116" style=" display:block; align:left;" /></a>
    
        <div id="menuheader">
    	<ul id="navlists">
    		<li id="item-first"><a href="http://www.furniturelandnewjersey.com" target="_top"><span>Home</span></a></li> 
    		<li><a href="http://www.furniturelandnewjersey.com/bedrooms1.html" target="_top"><span>Bedrooms</span></a></li>
    		<li><a href="http://www.furniturelandnewjersey.com/living-rooms1.html" target="_top"><span>Living Rooms</span></a></li>
    		<li><a href="http://www.furniturelandnewjersey.com/dining-rooms1.html" target="_top"><span>Dining Rooms</span></a></li>
    		<li><a href="http://www.furniturelandnewjersey.com/kids-bedrooms1.html" target="_top"><span>Kids Bedrooms</span></a></li>
            <li><a href="http://www.furniturelandnewjersey.com/coffee-tables1.html" target="_top"><span>Coffee Tables</span></a></li>
            <li><a href="http://www.furniturelandnewjersey.com/sofas1.html" target="_top"><span>Sofas</span></a></li>
            <li><a href="http://www.furniturelandnewjersey.com/sofa-beds1.html" target="_top"><span>Sofa Beds</span></a></li>
             <li><a href="http://www.furniturelandnewjersey.com/futons1.html" target="_top"><span>Futons</span></a></li>
    		<li id="item-last"><a href="http://www.furniturelandnewjersey.com/mattresses1.html" target="_top"><span>Mattresses </span></a></li>
    	</ul>
    </div> 
      </header>
      <div class="mainbody">
        <div class="sidebar1">
        <nav>
          <ul>
            <li><a href="http://www.furniturelandnewjersey.com/storehours.html">Store Hours</a></li>
            <li><a href="http://furniturelandnewjersey.com/contact.html"><font color="#C71F2E">Contact</font></a></li>
            <li><a href="http://maps.google.com/maps?q=160+Passaic+Avenue+B24,+Kearny,+NJ+07032">Directions</a></li>
            <li><a href="http://www.furniturelandnewjersey.com/contact.html">  Prices</a></li>
            <li><a href="http://www.facebook.com/pages/Furniture-Land/103100306437927">Deals</a></li>
            <li><a href="http://www.furniturelandnewjersey.com/chairs1.html">Chairs</a></li>
            <li><a href="http://www.furniturelandnewjersey.com/entertainment1.html">Entertainment</a></li>
            <li><a href="http://www.furniturelandnewjersey.com/futons1.html">Futons</a></li>
            <li><a href="http://www.furniturelandnewjersey.com/mattresses1.html">Mattresses</a></li>
          </ul>
    	  <aside><hr width="183px" align="left"/>
         <table cellpadding="0" width="183" cellspacing="0"><tr>
    <td><a href="http://www.facebook.com/pages/Furniture-Land/103100306437927" target="_blank"><img src="http://www.furniturelandnewjersey.com/image/images/FaceBook_48x48.png" alt="Join Our Facebook Fan Page" width="32" height="32" border="0"></a></td>
    
    <td><a href="http://www.myspace.com/yourpage" target="_blank"><img src="http://www.furniturelandnewjersey.com/image/images/MySpace_48x48.png" alt="Check Us Out On MySpace" width="32" height="32" border="0"></a></td>
    
    <td><a href="http://twitter.com/FurnitureLandNJ" target="_blank"><img src="http://www.furniturelandnewjersey.com/image/images/Twitter_48x48.png" alt="Follow Us On Twitter" width="32" height="32" border="0"></a></td>
    <td><a href="http://twitter.com/FurnitureLandNJ" target="_blank"><img src="http://www.furniturelandnewjersey.com/image/images/Feed_32x32.png" alt="Follow Us On Twitter" width="32" height="32" border="0"></a></td>
    </tr>
    </table>
    <p>Like and Follow Us!</p>
        </aside>
        </nav>      <!-- end .sidebar1 --></div>
      <article class="content">
    
        <section><table width="780"  cellpadding="0">
        
        <tr>
        <td width="780"  height="328" align="left" valign="top" bgcolor="#FFFFFF"> 
    <h1> <font style="font-family:Verdana; font-size:14pt; color:#333333;"> <b>Call 201-998-6656 for Prices!<br><br><a href="mailto:furnitureland@verizon.net?subject=Question" > FurnitureLand@verizon.net</a></b></font></h1>
          <p style="text-align:left"><font style="font-family:Verdana; font-size:12pt; color:#666666; text-align: right;"><b> NJ Showroom:</b><br> 160 Passaic Ave #24 <br> Kearny NJ, 07032 <br><br> Give us a call, shoot us an email, or come visit the store!<br> <br> <a href="http://www.facebook.com/pages/Furniture-Land/103100306437927">Like us on Facebook to hear about sales and more. </a></b></font> </p>
        </td>
    	 <td align="left"> <img src="http://www.furniturelandnewjersey.com/image/images/Map.png" name="Banner" width="265" height="298">
        </td>
    </table></section>
        <!-- end .content --></article>
    	<!-- end .mainbody --></div>
      <footer><table>
      <tr>
      <td>
      </tr>
      </table>
       <p1><a href="http://www.furniturelandnewjersey.com">Home</a> |<a href="http://www.furniturelandnewjersey.com/furniture-store-nj.html">Furniture Store NJ</a> |<a href="http://maps.google.com/maps?q=160+Passaic+Avenue+B24,+Kearny,+NJ+07032">Directions</a> |<a href="http://www.furniturelandnewjersey.com/storehours.html">Store Hours</a> |<a href="http://www.furniturelandnewjersey.com/mattresses-info.html">Mattress Info</a></p1><p>&copy;2011 Furniture Land, Inc. All Rights Reserved.| Furniture Land is a real furniture store and mattress outlet in NJ with a full showroom and warehouse. </p>
      </footer>
      <!-- end .container --></div>
    </body>
    </html>
    Sorry for posting so many questions.

  • #2
    Senior Coder alykins's Avatar
    Join Date
    Apr 2011
    Posts
    1,725
    Thanks
    41
    Thanked 191 Times in 190 Posts
    i think u have something cached... i just looked on IE7,8,9 and chrome... everything looks the same and no movement right

    I code C hash-tag .Net
    Reference: W3C W3CWiki .Net Lib
    Validate: html CSS
    Debug: Chrome FireFox IE


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •