SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Enthusiast
    Join Date
    Sep 2003
    Location
    south london
    Posts
    30
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    can you see where i've gone wrong?

    i made this lil nav menu and it works fine in firebird 0.7 and ie6 but in opera for some reason there is a small gap between the last menu item and the right hand side of the menu.
    i tried increasing the li size but that only makes the list wrap.
    increasing the a element's size would only cause the links to overlap.
    i'm pretty sure that it's probably something simple lilke forgetting to dot an i or cross a t (i read these forums a lot and it often is) but i just cant see what.

    here's the code

    Code:
     <style type="text/css">
    <!--
    .nav{
    position:relative;
    color:#000;
    height:1em;
    font:1em arial, sans-serif;
    width:50%;
    }
    .nav h3{
    margin:0;
    background: #a9a9a9;
    }
    .nav ul{
    background: #4169e1;
    list-style:none;
    margin:0;
    padding-left:0;
    float:left;
    width:100%;
    text-align:center;
    }
    .nav ul li{
    float:left;
    margin:0;
    width:33.3%;
    }
    .nav ul li a{
    display:block;
    color:white;
    text-decoration:none;
    padding: 0;
    width:100%;
    }
    .nav ul li a:hover{
    background: #99ccff;
    }
    .listbox{
    position:relative;
    top:0;
    border:6px dashed #000;
    border-left-style: solid;
    border-right-style: solid;
    }
    #next{
    background: #ffe4c4;
    clear:both;
    margin-top:0;
    color:#000;
    }
    -->
                        </style>
        <title>
          list practise
        </title>
      </head>
      <body>
        <div class="nav">
          <div class="listbox">
            <h3>
              navigation
            </h3>
            <ul>
              <li>
                <a href="#">link one</a>
              </li>
              <li>
                <a href="#">second link text</a>
              </li>
              <li>
                <a href="#">3rd</a>
              </li>
            </ul>
            <div id="next">
            </div>
          </div>
        </div>
      </body>

  2. #2
    SitePoint Addict BenANFA's Avatar
    Join Date
    Apr 2003
    Location
    Bath, UK
    Posts
    353
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Have you included a doc type in your source file ? something like

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

  3. #3
    SitePoint Enthusiast
    Join Date
    Sep 2003
    Location
    south london
    Posts
    30
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yeah i'm using a doctype.
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">

    thanks anyway though ben


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
  •