Center aligned nav bar twenty twelve theme

What CSS did you try?

This is what i’ve got now:

/* Navigation Menu */
.main-navigation {
margin-top: 24px;
margin-top: 1.714285714rem;
text-align: center;
}
.main-navigation li {
margin-top: 24px;
margin-top: 1.714285714rem;
font-size: 12px;
font-size: 0.857142857rem;
line-height: 1.42857143;
}
.main-navigation a {
color: #5e5e5e;
}
.main-navigation a:hover {
color: #21759b;
}
.main-navigation ul.nav-menu,
.main-navigation div.nav-menu > ul {
display: table;
margin: 0 auto;
}
.main-navigation ul.nav-menu.toggled-on,
.menu-toggle {
display: table;
margin: 0 auto;
margin-right: 0 auto;

}
.main-navigation ul.nav-menu,
.main-navigation div.nav-menu > ul {
border: none;
}

@media screen and (min-width: 600px) {
	.main-navigation ul.nav-menu,
	.main-navigation div.nav-menu > ul {
		border-bottom: 1px solid #ededed;
		border-top: 1px solid #ededed;
		display: inline-block !important;
		text-align: center;
		width: 100%;
	}
}

All I changed was text-align: left to center

Thanks so much for the help, but it doesnt seem to be working.. This is what ive got now:

[no need to post CSS – it’s all visible on your site]

Your child theme is not set up correctly – it should not contain a copy of the parent theme style.css file.

It should contain this:

/*
Theme Name:     Twenty Twelve Child
Theme URI:      https://example.com/
Description:    Child theme for the Twenty Twelve theme
Author:         Your name here
Author URI:     https://example.com/about/
Template:       twentytwelve
Version:        0.1.0
*/

@import url("../twentytwelve/style.css");

After that, add ONLY CHANGES you are making – a tool like Firebug will help you find the code that you need to add.

Hi guys,

Thanks alot for the help! totally forgot to edit the style.css for the child theme, its all working now!