Twenty Seventeen theme Issues with image responsiveness

  • I manage a self-hosted site using the free Twenty Seventeen theme and would like to know if there is css I can add to the Customizer to make the header image on the site fully responsive to mobile devices. Currently the header is not showing its full width on my phone and iPad mini. The site is tap.violencetransformed.org

    Aside from the header, the other featured images I assigned to each of the remaining frontpage sections are displaying fine on my phone and iPad, but ONLY if I navigate to each page using the drop-down under the About menu. If I just scroll through all the front page sections (which I am guessing most people do when viewing from mobile), the featured images appear cropped lengthwise. The first of the featured images has text overlay and the words are getting cut off at the sides. I would like to make sure that whether readers are using menu navigation, or free scroll, that the images are properly displayed.

    I am seeking the simplest solution possible – preferably without a plugin or child theme. If someone can help me with code to add to the customizer that would be awesome! Many thanks in advance.

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

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

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Which iPad version is it?

    Thread Starter ctutter

    (@ctutter)

    Hi Andrew, my iPad mini is version 9.3.5

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Ah okay this is not specific to your iPad, it can happen when looking at the site on a smaller browser.

    This is a design feature of the theme and the theme crops featured images from desktop to tablet devices and then displays them natural on mobile.

    The easiest thing you can do to resolve it is to use decorative images that do not contain information, i.e. just take away the text on top of the image.

    @ctutter. How did you resolve this? Your site looks great. I am running into the same issue with the header image. Especially on my other pages. Header image is cut very slim

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Twenty Seventeen theme Issues with image responsiveness’ is closed to new replies.