Resize logo

captura3.png

captura1.png

Hi again,

I am trying to resize the logo image as the gkbannertop do. When you make the screen smaller the bannertop resize and take the tablet.css data. But my logo has always the same size, it is not resizing as the banner.

I'd like to resize both at the same time. Then, in 640 px banner dissapear and logo get bigger in the center of the "smartphone", that is ok, but I don't know how to resize both logo and banner.

I send an image and the link to my website is http://www.territoriosnow.com

Thanks

Hi

Please try add this to override.css:

Code: Select all

@media only screen and (min-width:641px) and (max-width: 920px) {
#gkLogo.cssLogo {
width: 145px;
background-size: 100% auto;
}
}


Perfect¡¡¡
Works fine¡¡
Thanks

Perfect¡¡¡
Works fine¡¡
Thanks

Hi again teibite,

One question about the code you gave me. How can I write two rules for the logo size?? So one for 1100 to 921 (200px) and the other 920 to 641 (145px). Because I have write in this way and the second one doesn't works... only first:

Code: Select all

@media only screen and (min-width:921px) and (max-width: 1100px) {
    #gkLogo.cssLogo {
    width: 200px;
    background-size: 100% auto;
    }
   
@media only screen and (min-width:641px) and (max-width: 920px) {
    #gkLogo.cssLogo {
    width: 145px;
    background-size: 100% auto;
    }

Thanks

Hi

This code is wrong. You are missing closing tags. Use it like this:

Code: Select all

@media only screen and (min-width:921px) and (max-width: 1100px) {
    #gkLogo.cssLogo {
    width: 200px;
    background-size: 100% auto;
    }
}

@media only screen and (min-width:641px) and (max-width: 920px) {
    #gkLogo.cssLogo {
        width: 145px;
        background-size: 100% auto;
    }
}