• My navigation bar is vertical and I want it to be across the top.
    I’ve tried to adjust lines in the css under main navigation but nothing works.
    gallant theme

    it’s for https://www.thelanguagechef.com

    Here’s the HTML:

    #main-nav ul {display:block; float:left;margin-top:0px;z-index:10000; position:left; top:0px; right:100px;}
    #main-nav ul {display:block; margin-bottom:100;z-index:10000;}
    #main-nav ul li {display:block; float:left; margin-left:100px; height:40px;z-index:10000;}
    
    #main-nav ul a {display:inline; font:12px Tahoma; color:#494848; text-transform:uppercase;z-index:10000;}
    
    #main-nav ul li{position:relative;display:inline;float: left;z-index:10000;}
    #main-nav ul li a{display:block;text-shadow:1px 1px 1px #fff;z-index:10000;}
    /*IE6 hack to get sub menu links to behave correctly*/
    * html #main-nav ul li a{display:inline; z-index:10000;}
    /*1st sub level menu*/
    #main-nav ul li ul{position: absolute;left: 0;display: block;visibility: hidden;z-index:10000;background:#fafafa;width:100px;box-shadow: 0 1px 3px rgba(0, 0, 0, .3);-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);	-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);-o-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);border-radius:0px 0px 5px 5px;-moz-border-radius:0px 0px 5px 5px; -webkit-border-radius:0px 0px 5px 5px;background: -moz-linear-gradient(top,  rgba(250, 250, 250, 1), rgba(229, 229, 229, 1));	background:-webkit-gradient(linear,left top,left bottom, color-stop(0, #fafafa),color-stop(1, #e5e5e5));}
    
    /*Sub level menu list items (undo style from Top level List Items)*/
    #main-nav ul li ul li{display:block;float: none;margin-left:-2px; height:auto;z-index:10000;}
    #main-nav ul li ul li:last-child, #main-nav ul li ul li:last-child a {border-radius:0px 0px 5px 5px;-moz-border-radius:0px 0px 5px 5px; -webkit-border-radius:0px 0px 5px 5px;z-index:10000;}
    /*All subsequent sub menu levels vertical offset after 1st level sub menu */
    #main-nav ul li ul li ul{top: 0;background:#fafafa;padding:0;border-radius:5px;-moz-border-radius:5px; -webkit-border-radius:5px;z-index:10000;background: -moz-linear-gradient(top,  rgba(255, 255, 255, 1), rgba(229, 229, 229, 1));background:-webkit-gradient(linear,left top,left bottom, color-stop(0, #fff),color-stop(1, #e5e5e5));}
    #main-nav ul li ul li ul li:first-child, #main-nav ul li ul li ul li:first-child a {border-radius:5px 5px 0px 0px;-moz-border-radius:5px 5px 0px 0px; -webkit-border-radius:5px 5px 0px 0px;z-index:10000;}
    /* Sub level menu links style */
    #main-nav ul li ul li a{padding:8px 12px;margin: 0;margin-left:2px;font-size:11px;height:auto;text-shadow:1px 1px 1px #fff;color:#6d6b6bz-index:10000; display:block;}
    #main-nav ul li ul li a:hover{background: #e9e9e9;z-index:10000;}
Viewing 3 replies - 1 through 3 (of 3 total)
Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Navigation bar is messed up’ is closed to new replies.