Results 1 to 2 of 2

Thread: Navigation Should Get auto Width with list

  1. #1
    Join Date
    Aug 2009
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Navigation Should Get auto Width with list

    Hi,

    iam trying to made a navigation with auto stretchable width.

    for example..

    nav width is 1000px;

    if it has 4 tab than each tab should auto get 250px each to get align with the nav.

    if i insert 10 tabs than each tab het auto width of 100px each to get aligh with the tab

    like tables ....

    Any one have idea..Please HELPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPP..

  2. #2
    Join Date
    Sep 2008
    Location
    Seattle, WA
    Posts
    135
    Thanks
    1
    Thanked 11 Times in 11 Posts

    Default

    You would need to use a <ul> list for the navigation. Then set the width for the <li>'s to the percentage you need. Kind of like this:

    .menu ul {
    width: 100%;
    display: inline;
    }

    .menu li {
    width: 25%;
    }

    .menu li a:link {
    font-family: Arial;
    font-size: 10pt;
    color: #fff; // white against red background
    text-decoration: none;
    }

    .menu li a:hover {
    font-family: Arial;
    font-size: 10pt;
    color: #FFE900;
    background-color: #0000FF;
    }

    Then wrap it in a container div:

    #menuwrap {
    width: 1000px;
    position: relative;
    height: 30px; // optional but helps
    background-color: #FF0000;
    }

    This code isn't perfect but gives you something to work with

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
  •