I'm having trouble centering the navigation in my WordPress template that uses Bootstrap. I've tried using the center-block class on different elements, but the menu items are still aligning to the left. I even created a custom class in my custom.css file to mimic center-block, but it didn't work.
I've inspected each element to find out why they're not centering properly, but I can't figure it out. Where should I be adding the centering code? Here's the original PHP and HTML code:
<nav class="site-navigation" itemscope="itemscope" itemtype="http://schema.org/SiteNavigationElement">
<div class="container">
<div class="row">
<nav class="container primary">
<?php wp_nav_menu(
array(
'menu' => 'Primary Navigation',
'container' => 'div',
'container_class' => 'col-sm-12 primary'
)
); ?>
</nav>
</div>
</div><!-- .container -->
</nav><!-- .site-navigation -->