Support » Fixing WordPress » Stuck trying to center navigation bar

  • Krdanders

    (@krdanders)


    Been trying to figure out how to align my navigation menu center but haven’t had luck. Looked at other threads on here but all the suggestions didn’t help. Hoping someone can help me out?

    The blog is http://kawaiivinyl.com and I put the CSS below. Thank you in advance! 🙂

    .nav{
    	background:#ED4901;
    	width:835px;
    	float:left;
    	display:block;
    	position:relative;
    }
    
    .nav ul{
    	list-style:none;
    	display:inline-block;
    }
    
    .nav li{
    	float:left;
    	position:relative;
    	display:inline;
    }
    
    .nav a{
    	padding: 10px 65px 10px 24px;
    	display:inline-block;
    	text-decoration: none;
    	color:#fff;
    	font-size:17px;
    	text-align:center;
    	text-transform: lowercase;
    }
    
    .nav ul ul{
    	display:none;
    	position:absolute;
    	top:100%;
    	left:0;
    	float:left;
    	text-align:center;
    	z-index:99999;
    	background: #212121;
    }
    
    .nav ul ul ul{
    	top: 30%;
    	left:100%;
    	background: #343434;
    }
    
    .nav ul ul a{
    	height:auto;
    	line-height:1em;
    	padding:10px;
    	width:130px;
    }
    
    .nav li:hover > a,.nav ul ul:hover > a{
    	color:#ccc;
    }
    
    .nav ul li:hover > ul{
    	display:block;
    }
Viewing 4 replies - 1 through 4 (of 4 total)
  • Pioneer Web Design

    (@swansonphotos)

    We actually do not need you to post CSS, it is seen using web tools…

    First, where did you put this CSS?

    Also, you may run into some issue naming a folder “New 3.0 Theme” try “new_3_theme” (no spaces no .’s, lower case)

    David Choi

    (@wpthemes777)

    Edit the padding value, specially the 65px and 24px to align them

    .nav a {
        color: #FFFFFF;
        display: inline-block;
        font-size: 17px;
        padding: 10px 65px 10px 24px;
        text-align: center;
        text-decoration: none;
        text-transform: lowercase;
    }
    Krdanders

    (@krdanders)

    Seacoast-I put the CSS in the style.css file. Haven’t had problems with the folder of the theme so far (it’s been named that for a year)

    WP Help-Thanks for the tip! Was able to center it. Just need to check to see if it works on other browsers.

    David Choi

    (@wpthemes777)

    CSS padding is universal, it should work on all browsers without issues.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Stuck trying to center navigation bar’ is closed to new replies.