Logo scaling on responsive mobile view? - Support | Kriesi.at

Tagged: logo, responsive

Viewing 9 posts - 1 through 9 (of 9 total)

Author

Posts
February 26, 2014 at 9:44 pm #229775

sharonreiley
Participant

I am having a problem with the logo on my website being cropped when viewed on a mobile phone. I don’t want to make the logo smaller for the desktop or larger mobile versions of the site, but I was wondering if there was a way for it to scale to fit the screen automatically?

Here is a link to the site: http://www.promessafilms.com/

Thank you for your help!

February 26, 2014 at 10:39 pm #229783
Yigit
Keymaster
Hey sharonreiley!
Please add following code to Quick CSS in Enfold theme options under Styling tab
```
@media only screen and (max-width: 480px) {
.logo, .logo a, .logo im { max-height: 67px!important; }}
```
Regards,
Yigit
March 31, 2014 at 7:03 pm #245641

akhilz
Participant

hi Yigit
i have the same issue and the code suggested by you didn’t work for me. please help…

link to website: http://www.oshonow.net

March 31, 2014 at 7:07 pm #245646
Yigit
Keymaster
Hi!

Please add following code to Quick CSS
```
@media only screen and (max-width: 480px) {
.responsive .logo a, .responsive .logo img {
height: auto !important; }
#header_main { height: 120px; }
#advanced_menu_toggle { top: 130%; }}
```
Regards,
Yigit
March 31, 2014 at 7:13 pm #245648

akhilz
Participant

thanks yigit
that is better as the Menu button has come down and doesn’t cover the logo anymore.
but the logo is still cropped on the right side and there is lot of space available on the left. pls help…

March 31, 2014 at 7:20 pm #245652

Yigit
Keymaster

Hey!

I just checked your website on my iphone 4 and logo is not cut off on my end. Can you post a screenshot of the issue you are getting?
Please make sure to flush browser cache after applying custom CSS code

Best regards,
Yigit

March 31, 2014 at 7:29 pm #245656

akhilz
Participant

dear yigit, thanks again

i flushed the browser cache on my phone (Samsung Galaxy Note 3) and still have the same issue. the pic is here:

please _/\_

March 31, 2014 at 9:02 pm #245720

akhilz
Participant

hi yigit
added the following code to Quick CSS and it seems to work alright:

.responsive .logo a, .responsive .logo img {
width: 100% !important; }

hope it doesn’t break anything, as am just an amateur and tried to do something while waiting for the reply. please let me know that it is ok to keep this code…

March 31, 2014 at 9:24 pm #245733

Yigit
Keymaster

Hey!

This is how it looks on my end – http://i.imgur.com/oGVuaP6.png
I also tried resizing browser window and there is no problem. Let us know if anything comes up :)

Best regards,
Yigit
Author

Posts

Viewing 9 posts - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.