Sign in

Website logo on phone

  • This topic has 4 replies, 2 voices, and was last updated 4 weeks, 1 day ago by .
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #6706
    clac1

    Hello,

    I added a logo (300 pixels wide) to my website.
    On a smartphone, the logo is displayed very large : http://jouet.click-clack.fr
    Did I make a mistake somewhere?

    Thanks for your help!

    #6707
    chris

    Try setting a max-width on the image, with a height of auto.

    Since it’s the only image in your header, you could assign CSS like this…

    header img {
    max-width: 20wv;
    height: auto;
    }

    Here’s a screenshot from Chrome’s dev tools

    Screenshot-2021-12-23-172915

    Hope this helps!

    #6710
    clac1

    Hello,

    Thank you for your answser.

    I put in place the custom CSS code. And I try several max-width until 5wv, but the image is always so big when the page is displayed on a smartphone (see screenshot).

    Attachments:
    #6712
    chris

    Looked at it again in Chrome dev tools, and inspection indicates an invalid property value. My bad!

    Try using % instead of vw, like so:

    header img {
    max-width: 30%;
    height: auto;
    }

    Sorry for the error!!

    #6713
    clac1

    Great! It works.

    Many thanks and I wish you a Merry Christmas and happy new year !

Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Website logo on phone’ is closed to new replies.