Menu Button on Home Page is Misaligned

lifeismeantforexploring · Member · Jul 14, 2017 at 5:09 am
Copy link

Add topic to favorites
Hello,

We recently noticed that on mobile our “Menu” button at the top of our page hangs slightly lower than the page title. This recently came to be as it used to be positioned neatly in the top right corner. We haven’t made any changes to the theme or CSS in that time.

Any suggestions will be greatly appreciated!

TJ & Alli
Life Is Meant For Exploring

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Jul 14, 2017 at 9:33 pm
Copy link
Hi, with the padding on the site-header div, and with the width that is set for the title/tagline, there isn’t enough room for the title/tagline and the menu to be side-by-side on smaller screens. Add the following at the very bottom of your custom CSS, which adjusts the left and right padding and makes the title/tagline parent div (site-branding) narrower.
```
@media screen and (max-width: 480px) {
  .site-header {
    padding-left: 20px;
    padding-right: 20px;
  }
  .site-branding {
    max-width: 55%;
  }
}
```
lifeismeantforexploring · Member · Jul 15, 2017 at 5:57 am
Copy link
Hey thesacredpath,

Once again you have solved our problem. Thank you so much!

Wishing you all the best,

TJ & Alli
Life Is Meant For Exploring
thesacredpath · Member · Jul 15, 2017 at 8:41 am
Copy link
Awesome, and you are welcome, and same to you.

No items found.