<ul> Menu won't center - html

Question

I have a menu on wordpress that I'm trying to center, but it wont center itself. If I put auto on margin it doesn't do anything but when a fixed number is set, it does, but it doesn't align perfectly unlike using auto.
CSS
.menu {
width:auto;
float: left;
display:block;
}
#navcontainer {
display:inline;
padding:0px;
margin: 0px; /*-8px 0 0 10px;*/
list-style:none;
position:relative;
z-index:1;
float:left;
height: 20px;
width: 100%;
}
HTML
<section class="twelve columns text-center" style="background: transparent;">
<div class="menuimg">
<img src="http://fabioide.com/frederiksminde/wp-content/uploads/2014/10/menu.jpg">
</div>
<div id="navcontainer">
<?php wp_nav_menu( array( 'sort_column' => 'menu_order', 'container' => false, 'theme_location' => 'header-menu' ) ); ?></div>
</section>

Answer 1

HI now replace two css in your style sheet
#navcontainer {
float: none;
display: block;
list-style: none;
position: relative;
z-index: 1;
height: 20px;
width: 100%;
text-align: center;
}
.menu {
width: auto;
float: none;
display: inline-block;
text-align: left;
}

Answer 2

Try this in your css and your ul menu set center of #navcontainer with margin auto
change css as per follow:
.menu {
width: auto;
float: none; /*set this to float:none*/
display: inline-block; /*set this to display:inline-block*/
margin-left: auto;
}
#navcontainer ul {
margin: 0;
padding: 0;
list-style-type: none;
text-align: left;
margin-left: 0px;
overflow: hidden; /*add this to your css*/
}
#navcontainer ul li a{
border-top: 1px solid transparent;
border-left: 1px solid transparent;
border-right: 1px solid transparent;
}