Tagged: ,

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • November 21, 2015 at 10:54 pm #540272
    November 21, 2015 at 11:44 pm #540284
    sv3designs

    Adding this helped make it larger, but it still is not 200px tall and doesn’t extend to the entire screen on Chrome.

    .html_header_top.html_logo_center.avia-webkit .logo {
    left: 0%;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    }

    November 22, 2015 at 12:00 am #540288
    sv3designs

    Ok, after more debugging, I find

    adding:
    .html_header_top.html_logo_center.avia-webkit .logo {
    left: 0%;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    }
    .container {
    padding: 0px 0px;
    }

    to my custom css, fixes it for the most part, but the height is still off on chrome.

    This code will fully fix my issue on chrome, but messes things up on other browsers.
    .logo img{
    width: 100%;
    height: 200px;
    }

    November 22, 2015 at 12:17 am #540290
    sv3designs

    I finally added this to fix only on Chrome:
    @media screen and (-webkit-min-device-pixel-ratio:0) {
    .logo img{
    width: 100%;
    height: 100%;
    }}

    Please do let me know if there is a more elegant way to fix all this!

    November 23, 2015 at 8:36 am #540558
    Rikard

    Hi,

    Did your code work eventually? If not please post screenshots of the problem so that we can understand better. If your code works I would go with it :-)

    Regards,
    Rikard

    November 23, 2015 at 7:22 pm #541126
    sv3designs

    Hi, Rikard
    The code I added fixed the problem. But is is a lot of custom css. :-)
    Thanks
    Saras

    November 23, 2015 at 9:22 pm #541168
    Yigit

    Hey Saras!

    We would provide you the same code for the solution :)

    Best regards,
    Yigit

    May 2, 2016 at 4:43 am #625427
    odez

    Hello,

    I found this code very helpful, however, I’m finding the problem still exists on Firefox. Here’s a screen shot of the same logo file being used on a “Boxed Layout”. https://www.dropbox.com/s/i8wjaakbf3svbyh/Logo%20not%20sized%20correctly.pdf?dl=0
    The top screen shot shows the menu below the logo but the logo is NOT the full height of the header area.
    The bottom screen shot show the menu above the logo and it is sized correctly.

    I’ve added the code you suggested above to my Quick CSS:
    .html_header_top.html_logo_center.avia-webkit .logo {
    left: 0%;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    }

    Let me know if you have a correction for Firefox browser and why it would show correctly when menu is above but not when menu is below.

    Thank you,
    Olivia

    May 2, 2016 at 3:13 pm #625830
    Yigit

    Hi!

    Please change the code to following one 

    .html_header_top.html_logo_center .logo {
    left: 0;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
}

    Best regards,
    Yigit

    May 2, 2016 at 7:01 pm #625977
    odez

    Many thanks! That works perfectly!

    May 3, 2016 at 2:06 pm #626441
    Yigit

    Hi,

    You are welcome, glad we could help! Let us know if you have any other questions or issues :)

    Best regards,
    Yigit

  • Author
    Posts
Viewing 11 posts - 1 through 11 (of 11 total)
  • The topic ‘Logo not showing at 100% width only on Chrome browser’ is closed to new replies.