Hi there, I am working on a site and the logo is displaying nicely on my computer, I have no margin space under my logo, so it sits right on top of my menu bar. However, on my mobile phone there is a gap between the menu bar and the bottom of the logo. I don’t know what to adjust to close the gap for smaller devices.
Again, I am only getting the issue on my mobile device.
I am not using any custom CSS at this time, save for some color adjustments.
Thanks in advance.
Hi Adam
Try this under Appearance > Custom CSS:
/* Mobile */ @media (max-width: 680px) { body.responsive header#masthead .hgroup .logo { float: none; } }Not sure if I can post image link here, but this is what it looks like still. Didn’t adjust it yet.
https://onedrive.live.com/embed?cid=9ABF906408BA46D1&resid=9ABF906408BA46D1%2118383&authkey=AFkZ51Cu8Oa2iAo
Give the following a try instead:
/* Mobile */ @media (max-width: 680px) { body.responsive header#masthead .hgroup .logo { float: left; } }Andrew – The last snippet you sent worked like a charm. Everything is lining up perfectly now. Thanks.
Super, glad that did the trick.