Log & menu questions

Dknowlton1 · November 2015

Hi there,

I have 3 questions;

1. how do I move the logo further to the left? (see image)

2. How do I move the menu icon down and to the left? (see image)

3. How do I add a translucent colored square to the back of the menu icon so it is easier to see? (see image)

Thanks,

Dan

my website: http://kpsdigitalmarketing.co.uk/

Image: http://kpsdigitalmarketing.co.uk/wp-content/uploads/2015/11/be-theme-help.png

Albert · November 2015

Hi,

1. To move logo to the left side, you must increase top bar container width. This can be done with below css:

#Top_bar .container { max-width: 1400px !important; }

2. You can control icon's position with below css:

.header-overlay .overlay-menu-toggle { top: 100px !important; right: 100px !important; }

3. This can be done with below css:

.header-overlay .overlay-menu-toggle { background-color: #000 !important; line-height: 40px !important; }

Dknowlton1 · November 2015

Thank you so much!

This has worked great except for one thing.

On mobile the menu overlaps the logo (see image below).

http://kpsdigitalmarketing.co.uk/wp-content/uploads/2015/11/12226512_10156236886435472_2029391876_n.jpg

How can I make it not overlap?

Thanks for the awesome support!

Dan

Albert · November 2015

Put the css's we gave you above into right @media only screen tag, like:

@media only screen and (min-width: 1240px){
    #Top_bar .container { max-width: 1400px !important; }
    .header-overlay .overlay-menu-toggle { top: 100px !important; right: 100px !important; }
    .header-overlay .overlay-menu-toggle { background-color: #000 !important; line-height: 40px !important; }
}

That's the only way to fix it.

Dknowlton1 · November 2015

You guys are awesome - thank you so much!!

Dan

Albert · November 2015

You're welcome

Log & menu questions

Comments