Add a secondary logo in the header on the right side

what kind of header did you choose:
sticky, logo left menu below etc.

btw. on the example above i centered the navigation in this way:

.html_header_top.html_bottom_nav_header .main_menu ul:first-child {
    display: inline-flex;
    margin-left: 50%;
    transform: translate(-50%);
    white-space: nowrap;
    width: auto !important;
}

.html_header_top.html_bottom_nav_header #top .main_menu .menu-item-search-dropdown {
    float: left;
}

same code in child-theme functions.php but instead of css code above try this here (padding-right is the logo distance):

div .logo {
    float: left;
    padding-right: 25px;
    left: 0;
    position: relative;
    z-index: 1;
}

.logo.second-logo {
    float: left;
    position: relative !important;
    z-index: 1;
}

.responsive #top .logo {
    height: auto !important;
}

see link: Link

it is very nice when you come with your request bit by bit. :wink
first request was “additonal logo on the right hand side”
next two logos left littel padding
next now : main logo left two additional logos on the right
i think i will wait till you have found your final layout – sorry

Edit: and please think about what has to happen for small screen layout (Smartphones, Tabletts in portrait orientation)
Three logos (main logo left , two logos floating on the right )

• This reply was modified 8 years, 3 months ago by Guenni007.

not the quick css only .

first same as with two logos now three (that is for functions.php of child-theme):

function second_logo($logo) {
$logo .= '<strong class="logo second-logo"><a href="logo2link" >' ;
$logo .= '<img src="/wp-content/uploads/logo2.png"/>';
$logo .= '</a></strong>';
return $logo;
}
add_filter('avf_logo_final_output', 'second_logo');

function third_logo($logo) {
$logo .= '<strong class="logo third-logo"><a href="logo3Link" target="_blank">' ;
$logo .= '<img src="/wp-content/uploads/logo3.png"/>';
$logo .= '</a></strong>';
return $logo;
}
add_filter('avf_logo_final_output', 'third_logo');

you have to adapt those settings (logo2Link, logo3Link and the name path to your logos)

now my quick css (the values are pending to the logos itself. you have to play with those values – in my case i have choosen logo width in this way that on ipad landscape all logos fit the screen without floatin)

div .logo {
    float: left;
    padding-right: 25px;
    left: 0;
    position: relative;
    z-index: 1;
}

.logo a {
    max-width: 300px;
}

.logo.second-logo, .logo.third-logo {
    float: right;
    position: relative !important;
    z-index: 1;
}

.responsive #top .logo {
    height: auto !important;
}

if it does not look like you want it – without the link to your site i cannot give help here.
So either post here public the link to it. Or make it in private content – than you have to wait for mods here.

BTW. I’m testing myself on that playground the ubermenu integration – so it does not look like before because i replaced Enfold Navigation with UberMenu.