Hi There
I’m developing this site : http://lighthouse.carbon5creative.com.au for a friend of mine. When I view it on an iPad portrait the logo & menu items overlap. To resolve this I would prefer to have the logo centred then on the next line under the logo the menu centred. What code do I need to add to automatically switch to this view when in portrait mode on iPad?
Thanks for your help.
Jase
Hi,
Please add the css below to Quick CSS or to /css/custom.css
@media only screen and (max-width:989px) and (min-width:768px) {
.responsive .mobile_slide_out .logo img {
position:relative;
right:5px;
top:-6px;
}
.main_menu {
bottom:-40px;
right:-20px;
}
.main_menu .menu ul {
position:absolute;
top:85px;
}
li .avia-menu-fx,.current-menu-item>a>.avia-menu-fx,li .current_page_item>a>.avia-menu-fx {
position:absolute;
top:84px;
}
li:hover .avia-menu-fx,.current-menu-item>a>.avia-menu-fx,li:hover .current_page_item>a>.avia-menu-fx {
position:absolute;
top: 84px;
}
}
if you need to change things simply use this as a template
Thanks,
Nick
Great thank you. I’ll give it a go.
Worked beautifully thanks very much. Appreciate your help.