SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Enthusiast
    Join Date
    Nov 2010
    Posts
    80
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    IE breaks nav bar

    Typical IE...menu works fine in Firefox but the dropdowns are non existent in IE.

    HTML Code:
    <ul>
            	<li><a href="Botox.php">Botox</a></li>
    			<li><a href="cryoderm.php">CryoDerm Medical Peel</a></li>
    			<li><a href="Facials.php">Facials</a></li>
    			<li><a href="GiftCards.php">Gift Cards</a></li>
    			<li><a href="Laser.php">Laser</a></li>
                <li><a href="Massages.php">Massage Therapy</a></li>
    			<li><a href="Microdermabrasion.php">Microdermabrasion</a></li>
    			<li><a href="MineralMakeup.php">Mineral Makeup</a></li>
    			<li><a href="PaymentOptions.php">Payment Options</a></li>
    			<li><a href="RelatedServices.php">Related Services</a></li>
    			<li><a href="Restylane.php">Restylane, Perlane & Juvederm</a></li>
    			<li><a href="SkinRejuvenation.php">Skin Rejuvenation</a>
                	<ul>
                    	<li><a href="Isolaz.php">Isolaz</a></li>
                        <li><a href="SmoothBeam.php">Smooth Beam Skin Rejuvination</a></li>
                        <li><a href="Ultherapy.php">Ultherapy</a></li>
                        <li><a href="VelashapeNeckLift.php"></a></li>
                    </ul>
                </li>
    			<li><a href="Waxing.php">Waxing</a></li>
    		</ul>
            </li>
        <li><a href="RelatedServices.php"><img src="images/WEB-TEMPLATE-flat-2_04.gif" border="0" width="132"></a>
        	<ul>
            	<li><a href="http://www.capcny.com/" target="_blank">CAP Medical</a></li>
    			<li><a href="CNYFunctionalandWellnessMedicine.php">CNY Functional & Wellness Medicine</a></li>
    			<li><a href="CNYMedicalAcupuncture.php">CNY Medical Acupuncture</a></li>
    			<li><a href="Dermatology.php">Dermatology</a></li>
            </ul>
            </li>
       <li><a href="Products.php"><img src="images/WEB-TEMPLATE-flat-2_05.gif" border="0" width="91" height="29"></a>
       		<ul>
        		<li><a href="Environ.php">Environ</a></li>
    			<li><a href="JaneIredale.php">Jane Iredale Make-up</a></li>
    			<li><a href="Latisse.php">Latisse Lash Enhancer</a></li>
                <li><a href="Skinceuticals.php">Skinceuticals</a></li>
               <li><a href="skinmedica.php">Skin Medica</a></li>
    		</ul>
      	</li>
        <li><a href="AboutUs.php"><img src="images/WEB-TEMPLATE-flat-2_06.gif" border="0" width="81" height="29"></a>
        	<ul>
            	<li><a href="Staff.php">Staff</a></li>
                <li><a href="History.php">History</a></li>
                <li><a href="Testimonials.php">Testimonials</a></li>
            </ul>
        </li>
        <li><a href="Events.php"><img src="images/WEB-TEMPLATE-flat-2_07.gif" border="0" width="54" height="29"></a></li>
        <li><a href="VirtualTour.php"><img src="images/WEB-TEMPLATE-flat-2_08.gif" border="0" width="110" height="29"></a></li>
        <li><a href="Contact.php"><img src="images/WEB-TEMPLATE-flat-2_09.gif" border="0" width="75" height="29"></a></li>
        <li><a href="RequestAppointment.php"><img src="images/WEB-TEMPLATE-flat-2_10.gif" border="0" width="190" height="29"></a></li>
    </ul>
    Code:
    
    #menu{
        padding: 0px;
    	background:#7b8b6f;
    	margin-bottom: -3px;   
    }
    
    /* only mainmenu listitems */
    #menu > li{
        display: inline-block;
        position: relative;
    	padding: 0px;
        font: bold 14px univers, verdana, arial;
    }
    
    /* links in mainmenu and both submenus */
    #menu a{
        display: block;
    	text-indent: 0px;
    	background:#7b8b6f;
    	color: #FFFFFF;
    	text-decoration: none;
    }
    
    /* submenus of both levels */
    #menu li ul{
    	position: absolute;
    	width: 150px;
    	margin: -7px 0px 0px -5px;
    	padding: 8px;
    	text-align: left;
    	font: bold 12px univers, verdana, arial;
    	list-style-type: none;
    	
    	z-index: 10000;
    }
    
    #menu li ul a{
    	padding-left: 5px;
    	background-color: #f7e2e2;
    	color: #653c2b;
    }
    
    /* move the second level submenu to the right to don't overlap the parent submenu */
    #menu ul ul{
    	top: 185px;
    	left:155px;               
    }
    
    /* hover effect for submenu links */
    #menu li li a:hover{
       background-color: #7b8b6f;
       color: #FFFFFF;
    }
    
    /* hide all submenus for default */
    #menu li ul{
        left:-9999px;
    }
    
    /* show a submenu if the direct parent listitem is hovered */
    #menu li:hover > ul{
        display:block;
    	
    }
    
    img {
    display: block; 
    border: 0;

  2. #2
    SitePoint Mentor bronze trophy
    ronpat's Avatar
    Join Date
    Jun 2012
    Location
    NJ, USA
    Posts
    2,534
    Mentioned
    62 Post(s)
    Tagged
    2 Thread(s)
    Which version of IE?

  3. #3
    SitePoint Enthusiast
    Join Date
    Nov 2010
    Posts
    80
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I solved the issue. It's an old site that was built years ago and I had to make some changes to it per our client's request. Turns out whoever built the site removed all the DocType headings and what not. I added them back in and it solved the issue.

  4. #4
    SitePoint Mentor bronze trophy
    ronpat's Avatar
    Join Date
    Jun 2012
    Location
    NJ, USA
    Posts
    2,534
    Mentioned
    62 Post(s)
    Tagged
    2 Thread(s)
    Great, glad you found the solution. Thanks very much for the feedback.


Bookmarks

Posting Permissions

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