Alignment of Header after update


About 6 months back you helped me put a phone number below the menu which is great. I have just updated the template to the latest version of Sydney Pro and it has moved the number from below the menu to squashed in the right hand side of the menu. Here is a link to a demo site a replicated. Can you please help as I really like the phone number being positioned there. I did try putting the code down one div but it positions far too low.

the code I used is - class=“header_phone” below.

Thank you

<header id=“masthead” class=“site-header” role=“banner”>
<div class=“header-wrap”>
<div class=“container”>
<div class=“row”>
<div class=“col-md-4 col-sm-8 col-xs-12”>
<?php if ( get_theme_mod(‘site_logo’) ) : ?>
" title="<?php bloginfo(‘name’); ?>">" alt="<?php bloginfo(‘name’); ?>" />
<?php else : ?>
<h1 class=“site-title”>" rel=“home”><?php bloginfo( ‘name’ ); ?></h1>
<h2 class=“site-description”><?php bloginfo( ‘description’ ); ?></h2>
<?php endif; ?>
<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 class=“header_phone”>
(08) 8852 1111
</header><!-- #masthead -->

<?php do_action(‘sydney_after_header’); ?>

Hello Maxco,

Did the update process remove your custom CSS? If you don’t have a backup of it, try adding the following one into your site’s additional CSS option under Appearance > Customize > Additional CSS.

@media only screen and (min-width:768px) { 

  .header-wrap .container{
    position: relative;

    display: inline-block;
    width: auto;
    position: absolute;
    right: 0;
    bottom: 0;

@media only screen and (max-width:767px){
  .header-wrap .col-md-8{
    margin-bottom: 20px;


Thank you so much! You guys are Awesome!

You’re welcome and best wishes!