Center menu full width menu in Twenty Twelve

Working with a childtheme for Twenty Twelve.

I’m trying to center the text, but after a lot of options not one of them solves the problem. I made the changes in the childtheme ofcourse. I think the code from the original theme is correct, because the text-align tag is already set to ‘center’ (I didn’t make any changes in it). So the text should be centered, but it’s not working. When I copy the code in the stylesheet from the childtheme it obviously doesn’t make any difference. I’ve read a lot of topics here, but none of their solutions worked, so I’m really desperate now! I can’t find what’s wrong.

I think the problem is in the original theme, but how can I solve this? I already removed + installed the theme again. Didn’t make any difference.

This is the code from the stylesheet from my original theme.

/* 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,
.main-navigation a:focus {
	color: #21759b;
}
.main-navigation ul.nav-menu,
.main-navigation div.nav-menu > ul {
	display: none;
}
.main-navigation ul.nav-menu.toggled-on,
.menu-toggle {
	display: inline-block;
}

The full width of the menu is also a problem. I hope someone can help me.