-
Posts
-
Hi guys,
I’m using a logo that’s 960×84. In Chrome, when I resize my window, the first time the logo resizes, it’s fine, but the second size (which is what I see on my iPhone) the logo is squeezed.
It looks like this is what I need to be tweaking – changing the height tag to something like 50px to keep the correct aspect ratio, and although it fixes the problem when the browser is at it’s narrowest, it also makes the logo tiny when the browser is normal width:
.responsive .logo a , .responsive .logo img{margin: 0 auto; max-width: 100%; height:80px !important; max-height:80px !important;}
I’ve searched the forums and haven’t been able to sort out a solution.
Thanks,
Paul
I managed to track down a solution that works in Chrome:
@media only screen and (max-width: 767px) {
.responsive #header_main .container {
height: 50px !important;
}
.responsive .logo a, .responsive .logo img, .responsive .logo {
height: auto !important;
max-height: 80px !important;
}
#advanced_menu_toggle, #advanced_menu_hide { top: 78%: }
}The only issues at the moment are – the logo doesn’t resize to the smallest size in IE and the little menu box ends up on top of my logo.
-Paul
- You must be logged in to reply to this topic.