Results 1 to 1 of 1

Thread: Drop Down Tabs menu setting fixed width?

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

    Default Drop Down Tabs menu setting fixed width?

    I am using the 'Drop Down Tabs Menu' in a vertical layout rather than the usual horizontal layout however I want my background colour bars to be a fixed width instead of being only as wide as the text. I have played around for ages but cant seem to redefine the width. Does anyone have any ideas?

    Here is the style sheet:
    Code:
    .bluetabs2{
    height: 28px;
    margin-top: 0px;
    margin-right:  0px;
    margin-bottom: 2px;
    padding-top: 3px;
    }
    
    .bluetabs2 ul{
    padding: 0px 0;
    margin-left: 0;
    margin-top: 0px;
    margin-bottom: 0px;
    font: 12px Verdana;
    list-style-type: none;
    text-align: left; /*set to left, center, or right to align the menu as desired*/
    }
    
    .bluetabs2 li{
    display:inline;
    margin: 0px;
    }
    
    .bluetabs2 li a{
    text-decoration: none;
    font-weight: bold;
    height: 28px;
    padding: 6px 12px;
    margin-right: 0px;
    margin-bottom: 0px;
    color:#666666; /*THEME CHANGE HERE*/
    background: white top left repeat-x;
    }
    
    .bluetabs2 li a:visited{
    color:#666666;
    }
    
    .bluetabs2 li a:hover{
    color: #FFFFFF;
    background: #333333 url(media/bluetab1.gif) top left repeat-x;
    }
    
    .bluetabs2 li.selected{
    color: #FFFFFF;
    }
    
    .bluetabs2 li.selected a{ /*selected main tab style */
    color: #FFFFFF;
    background: #333333 url(media/bluetab1.gif) top left repeat-x;
    }
    
    .bluetabs2 li.selected a:hover{ /*selected main tab style */
    color: #FFFFFF;
    text-decoration: none;
    }
    
    /* ######### Style for Drop Down Menu ######### */
    
    .dropmenudiv_b{
    position:absolute;
    text-align: left;
    border: 0px solid #918d8d; /*THEME CHANGE HERE*/
    border-width: 0px 1px;;
    font: 12px Verdana;
    line-height:18px;
    z-index:100;
    background-color: white;
    width: 130px;
    visibility: hidden;
    }
    
    
    .dropmenudiv_b a{
    width: auto;
    display: block;
    text-indent: 5px;
    border: 0px solid #918d8d; /*THEME CHANGE HERE*/
    border-bottom-width: 2px;
    padding: 2px 0;
    text-decoration: none;
    color:#333333;
    }
    
    * html .dropmenudiv_b a{ /*IE only hack*/
    width: 100%;
    }
    
    .dropmenudiv_b a:hover{ /*THEME CHANGE HERE*/
    background-color:#666666;
    font-weight:bold;
    }
    Last edited by Snookerman; 05-02-2009 at 10:23 AM. Reason: added [code] tags

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
  •