Menu Inline to the Right


#1

Hello!
How can i align the menu inline to the right?

Thanks!


#2

Hello,

as default, this theme place the main menu aligned to the right.

can you elaborate more about your question? I think I missed something with your question. and also can you post the link of your site here?


#3

Sorry, I ask about placing to the left in another topic, and someone told me the same you did, but about the left and add an image where right was left and left was right, so I ask again and change left for right.
I want my menu in the left side, as I show in the image.
Thanks!


#4

Hi, you can move the menu to the left then, but its better if you made it from a child theme.

you can follow this step below:

  1. create a child theme

  2. duplicate header.php from parent theme to your child theme

  3. change the code inside of
    <header id="masthead" class="site-header" role="banner"> with this:

<div class="header-wrap">
	<div class="container">
		<div class="row">
			<div class="col-md-8 col-sm-4 col-xs-12">
				<div class="btn-menu"></div>
				<nav id="mainnav" class="mainnav" role="navigation">
				<?php wp_nav_menu( array( 'theme_location' => 'primary', 'fallback_cb' => 'sydney_menu_fallback' ) ); ?>
				</nav><!-- #site-navigation -->
			</div>
			<div class="col-md-4 col-sm-8 col-xs-12">
				<?php if ( get_theme_mod('site_logo') ) : ?>
				<a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php bloginfo('name'); ?>"><img class="site-logo" src="<?php echo esc_url(get_theme_mod('site_logo')); ?>" alt="<?php bloginfo('name'); ?>" /></a>
				<?php else : ?>
				<h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>
				<h2 class="site-description"><?php bloginfo( 'description' ); ?></h2>	        
				<?php endif; ?>
			</div>
		</div>
	</div>
</div>
  1. add this css code below to style.css:
.site-title, .site-description {
    text-align: right;
}
nav#mainnav {
    float: left;
}

.btn-menu {
    float: left;
}

@media only screen and (max-width: 767px){
	.btn-menu {
		float: none;
	}
	.site-title, .site-description {
    text-align: center;
	}
}