Is there a way to vertically center the WordPress function wp_nav_menu in my site header? Although I followed the learnWebCode tutorial for the menu, I am struggling to implement it successfully. Is there anyone who can provide guidance or a solution?
<!-- site header -->
<header class="site-header">
<div class=container3>
<h1 class="logo-title"><a href="<?php echo home_url(); ?>"><?php bloginfo('name'); ?></a></h1>
</div>
<nav class="site-nav">
<?php
$args = array(
'theme_location' => 'primary'
);
?>
<?php wp_nav_menu( $args ); ?>
</nav>
</header><!-- site header -->
This is my css:
/*Navigation Menus*/
.site-nav ul{
margin: 0px;
text-align: center;
display:inline-block;
float: right;
width: auto;
}
.site-nav li{
list-style-type: none;
padding: 0px;
height: 24px;
margin-top: 4px;
margin-bottom: 4px;
display: inline;
}
.site-nav ul:before, .site-nav ul:after {
content ""; display: table;
}
.site-nav ul:after {
clear: both;
}
.site-nav ul li {
list-style: none;
float: right;
text-align: center;
}
/* Site Header Menu */
.site-header nav ul li a:link,
.site-header nav ul li a:visited {
display: block;
padding: 10px 20px;
}