How to align Title/Logo when using the Top Menu Style

Hello all,

I’m sharing this because I just figured it out myself.

I like the Top Menu Header style in OceanWP because I can have a full header image with the menu underneath. Unfortunately the Title and tagline were centered. I didn’t like that and wanted them left aligned. This should also work if you want them right aligned with this Style of Header.

This requires the use of the Custom CSS/JSS section. I used the Firefox Inspect option to finally figure out what needed to be changed. So if you are like me and like this Header style, this should help. In the Custom CSS use the following. This moves the Title/Logo block, yes I also tested a logo, to the left and then aligns all the text to the Left as well.

#site-header.top-header #site-logo {
    float: left;
    display: inline-block;
    padding: 50px 0;
}

#site-header.top-header .header-bottom {
    text-align: left;
}

This should also work if you want to Float Right and Text align Right.

In another post on here I was having a problem with not being able to set the color of my tagline anywhere in the standard sections. I found help here so this is borrowed from someone else. But if your tagline is a color you don’t want but you want it to show then use this.

#site-header.top-header #site-logo #site-description h2 {
    color: #ffffff;
}

I’m only working locally so I can’t link to anything and this doesn’t let me share screenshots, sorry.