Logo in mobile

[tirano]

Hello, please I need help with a situation when I open the site via mobile iPhone or Android logo is not responsive, it remains large (the same size from the desktop) and misconfigured to the left side instead of staying centered, staying on top of the menu it impossible to access the menu … could help me please? thank you

[livemesh]

Will loading a different logo (perhaps something resized from the original in photoshop or other tool) work for you instead of resizing the existing one with CSS? Here is how to do it the easy way by inserting this code in the Custom CSS tab of the options panel –

@media only screen and (max-width: 479px) {
#site-title a { background-image: url("http://example.com/wp-content/uploads/2013/02/mobile-logo.png")  !important;}
}

For tablets –

@media only screen and (max-width: 767px) {
#site-title a { background-image: url("http://example.com/wp-content/uploads/2013/02/tablet-logo.png")  !important;}
}

[tirano]

Hello thanks for the reply … sorry I did not understand completely, I go up a logo with smaller size and insert the URL among this code and insert it in the theme options panel? My current logo has 272 x 100 pixels, what is the ideal size to fit perfectly mobile and tablet?
thank you

[livemesh]

Yes right – you just replace the url above with the one for your image. Insert the code into Custom CSS tab in options panel. Thanks

[Author]

Posts