Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • March 12, 2014 at 10:20 pm #236572
    penumbra

    Hi there –
    I have a png logo file. On desktop when the width of the page is scaled below about 750px the logo is enlarged and breaks up. On mobile (iPhone) the log is enlarged and breaks up. Is there anyway to improve the appearance of the logo? I’ve put a site link in a private reply.
    Thanks so much.

    • This topic was modified 10 years, 8 months ago by penumbra.
    March 12, 2014 at 10:22 pm #236573
    penumbra
    This reply has been marked as private.
    March 13, 2014 at 3:30 pm #236960
    Yigit

    Hey!

    Please add following code to Quick CSS in Enfold theme options under Styling tab

    @media only screen and (max-width: 767px) {
.responsive .logo a, .responsive .logo img {
max-height: 29px !important;
}}

    Best regards,
    Yigit

    March 13, 2014 at 9:20 pm #237190
    penumbra

    This solved the main problem.
    On an iPhone viewed vertically the menu is over the logo. Any fix for that?
    If I add white to the bottom of the logo to better align it will I need to change the dimensions in the code?
    Thank you!

    March 14, 2014 at 1:24 pm #237589
    Yigit

    Hey!

    Please add following code to Quick CSS as well

    @media only screen and (max-width: 480px) { 
#advanced_menu_toggle, #advanced_menu_hide {
right: -50px; }}

    You can post a screenshot and show how you would like to display your logo and maybe we can provide you custom CSS code

    Regards,
    Yigit

    March 15, 2014 at 12:18 am #237861
    penumbra

    Hi there –
    Thanks for that code. It did move the menu out of the way of the logo on the iPhone although almost off the screen in vertical orientation but definitely an improvement. Two things to make it better:
    1. When scrolling on desktop the logo get’s partially cut off (see screen shot via link).
    2. I wonder if there a way to position that mobile menu just to the right of the logo (see screen shot via link).
    I tried changing the size of the logo and could not make it better, it is currently 300×19 px.
    Please see the posted screen shots of the desktop version and the iPhone running iOS7 via the links in the private reply below.
    Best.

    • This reply was modified 10 years, 8 months ago by penumbra. Reason: additional information
    March 15, 2014 at 12:18 am #237862
    penumbra
    This reply has been marked as private.
    March 17, 2014 at 5:19 pm #238839
    Yigit

    Hi!

    Please add following code to Quick CSS as well

    .header-scrolled strong.logo { padding-top: 10px; }
@media only screen and (max-width: 480px) { 
.responsive .logo a, .responsive .logo img {
max-height: 25px !important;
}
#advanced_menu_toggle, #advanced_menu_hide {
right: -25px;
}}

    Regards,
    Yigit

    March 18, 2014 at 1:17 pm #239316
    penumbra

    Hi there – This works beautifully! Thanks so much for your support.

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Logo file display issue’ is closed to new replies.