www.webdeveloper.com
Results 1 to 2 of 2

Thread: IE8 Fix for my <ul> ?

  1. #1
    Join Date
    Jul 2012
    Posts
    14

    IE8 Fix for my <ul> ?

    There seems to be zero styling on my <ul> here in ie8

    I have two navigations floating on either side of my logo. The floats seem to work ok too, although the bottom:0px; is not working.

    All works perfect in FF and safari.

    Any suggestions ?


    CSS
    Code:
    .nav-wrapper nav ul  {
    	position:absolute;
    	display:inline-block;
    	border-top:1px solid #666;
    	bottom:0px;
    	width:400px;
    }
    
    .nav-wrapper nav ul li  {
        float:left;
        display:block;
    	width:133px;
    }
    
    .nav-wrapper nav ul li a {
    	color:#000;
        list-style:none;
        text-decoration:none;
        font-size:80%;
        display: block;
    	padding:1em 0.5em 1em 0.5em;
    	text-align:center;
    }
    
    .nav-wrapper nav ul li a:hover {
        background-color:#e8e8e8;
        position: relative;
    }
    HTML
    Code:
    <div id="nav-left">
    <div class="nav-wrapper">
           <nav>
              <ul>
                <li>
                  <a href="#">NEWS</a>
                </li>
                   <li>
                  <a href="#">COLLECTIONS</a>
                </li>
                   <li>
                  <a href="#">RULES</a>
                </li>
              </ul>
          </nav>
        </div><!--end of nav-wrapper-->
      </div><!--left-nav-->
    
    <div id="nav-right">
    <div class="nav-wrapper">
           <nav>
              <ul>
                <li>
                  <a href="#">TEST</a>
                </li>
                   <li>
                  <a href="#">TEST</a>
                </li>
                   <li>
                  <a href="#">TEST</a>
                </li>
              </ul>
          </nav>
        </div><!--end of nav-wrapper-->
      </div><!--right-nav-->

  2. #2
    Join Date
    Feb 2003
    Location
    Michigan, USA
    Posts
    5,773
    Move "list-style:none;" into the .nav-wrapper nav ul style declaration. That CSS property will not affect <a> tags.

    Also, you might need to provide some default styling for the <nav> element, which IE8 does not support.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

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



Recent Articles