Tagged: logo, menu, re-size, responsive
Hi,
When my screen re-sizes to about 970px, the menu overlaps the logo. Also when the “slide-out” menu icon appears, it also overlaps my logo. How can I fix this without making my logo smaller?
Here is my site: http://ci.christianinternethosting.com/
Thanks!
– Caleb
Hi,
You can make the logo smaller for that screen size while making the font smaller as well. Not much else you can do if you have that many menu items. Can ofcourse force the mobile menu earlier for that screen size as well. Here is the css code , please add it to your css/custom.css or to Quick CSS located in Enfold > Theme Options > Layout Styling… the text area at the bottom of the page:
http://www.clipular.com/c?9716021=yrkbqE9ieSXtdawm-vanJgl77ek&f=.png
@media only screen and (min-width:768px) and (max-width:989px) {
.logo {
width:230px;
right:110px;
position:relative;
}
.main_menu {
right:-70px;
}
.logo {
float:left;
position:absolute;
bottom:-10px
}
.container {
position:relative;
right: 30px
}
}
Thanks,
Nick
Thank you, the CSS worked. Awesome theme.
On this Forum, why am I not getting email notifications when someone replies to my post? Can I turn that on somewhere?