Mobile version image is too large

  • Resolved junenagy

    (@junenagy)


    8 years, 2 months ago

    Hello,

    When I try the site on my mobile phone, the landing page image is too large and hangs over the actual page. This doesn’t happen when I shrink the page on my desktop to a mobile size. It is a Samsung Edge s7 that I am using.

    http://www.quadraliving.com

    Thanks for any help to fix this!

    June

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    8 years, 2 months ago

    I think the thing that’s causing that is a large text.

    It looks like you’ve added this CSS:

    
/* Quadraliving heading */
.site-title, .site-title a {color: #000000 !important;font-family: Baskerville, serif;font-size: 75px;font-weight: 500;line-height: 80px;letter-spacing: 5px;margin: 0 0 23px 0;}

    And the bit with the issue is this:

    
/* Quadraliving heading */
.site-title, .site-title a {
    ...
    font-size: 75px;
}

    First, remove that font-size line from the code.

    Then add this:

    
/* Quadraliving heading */
.site-title, .site-title a {
    font-size: 50px;
}

@media screen and (min-width: 768px) {

    /* Quadraliving heading */
    .site-title, .site-title a {
        font-size: 75px;
    }
}
    Thread Starter junenagy

    (@junenagy)

    8 years, 2 months ago

    Hey Andrew!

    That worked perfectly. Thank you, I am so grateful for your support!

    June

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    8 years, 2 months ago

    You’re very welcome 🙂

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Mobile version image is too large’ is closed to new replies.