Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • September 6, 2014 at 7:40 am #314408
    Jojo_W

    Please visit my clients site: http://www.westedgedesignfair.com

    When I first designed this site the mobile and iPAD view were fine. With the latest theme update the logo (which is long) gets squished on the iPad and Mobile views. Is there a short code fix? Thank you! Jojo

    September 6, 2014 at 8:48 pm #314565
    Josue

    Hey!

    I’d suggest you to use another (shorter) logo for mobile, you can do that with CSS:

    @media only screen and (max-width: 989px) {
  .logo img { 
    opacity: 0; 
  }
  .responsive .logo a { 
    background-image: url("mobile_logo_url_here"); 
    background-repeat: no-repeat; 
    background-size: contain; 
    background-position: center center;
  }
}

    Cheers!
    Josue

    September 7, 2014 at 3:27 am #314661
    Jojo_W

    Josue,
    Check it out. The mobile logo wont resize. I tried it 290 pixels wide, 240 ( what it is now), 150 and 75. The logo stays the same size just gets blurry when I go smaller in width.
    http://www.westedgedesignfair.com

    Thank you!
    Jodie

    September 7, 2014 at 5:38 am #314677
    Josue

    Hi Jodie!

    Use this code:

    @media only screen and (max-width: 989px) {
  .logo img { 
    opacity: 0; 
  }
  .responsive .logo a { 
    background-image: url("http://westedgedesignfair.com/wp-content/uploads/2014/09/westedgedesign-logo-240.png"); 
    background-repeat: no-repeat; 
    background-size: contain; 
    background-position: left top;
    width: 200px !important;
  }
  
}

    Regards,
    Josue

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.