Home page 9 style page is not responsive

This topic has 9 replies, 4 voices, and was last updated 8 years, 1 month ago ago by Eva Kemp

  • Avatar: Kris
    Kris
    Participant
    January 21, 2016 at 19:01

    Hello,

    I am building a home page similar to your home page 9 and it looks great, it’s just not responsive to any screen size but desktop. How can I fix that? Iv’e tried everything.

    Thanks!

    -Kris

    Please, contact administrator
    for this information.
    8 Answers
    Avatar: Eva
    Eva Kemp
    Support staff
    January 21, 2016 at 19:52

    Hello,

    Try to add the css code in custom.css:

    .product-category img {
    width: 100%;
    }

    Regards,
    Eva Kemp.

    Avatar: Kris
    Kris
    Participant
    January 21, 2016 at 22:27

    Eva,

    That didn’t really do much. maybe i have to adjust a setting in visual composer? I’m not sure what it could be. Please feel free to go back end and take a look

    Thank you,

    -Kris

    Avatar: Eva
    Eva Kemp
    Support staff
    January 22, 2016 at 12:20

    Hello,

    As I see the page is responsive http://storage1.static.itmages.com/i/16/0122/h_1453461596_5874477_160d96f081.png . Please clarify what problems exactly you have, show a screenshot.

    Thank you.

    Regards,
    Eva Kemp.

    Avatar: Kris
    Kris
    Participant
    January 22, 2016 at 19:02

    The theme itself is responsive but the columns and images don’t get responsive. They begin to get convoluted as soon as i start to scale the page down. And also the nav bar becomes unusable when you scroll down. I have provided screen shots. Thanks!

    -Kris

    http://postimg.org/image/kdhm7cr0n/

    http://postimg.org/image/jxh2srwqr/

    Avatar: Kris
    Kris
    Participant
    January 22, 2016 at 20:33

    Update: I fixed the navigation bar

    Avatar: Jack Richardson
    Jack Richardson
    Support staff
    January 25, 2016 at 11:33

    Hello,

    I’ve set “Contain” option for row background as shown on the sceenshot http://prntscr.com/9ujt9d
    Please clear browser cache and check mobile version now.

    Best regards,
    Jack Richardson.

    Avatar: graebermedien
    graebermedien
    Participant
    February 5, 2016 at 09:48

    hi there,

    having the same issue setting “contain” on background doesnt fix it.
    The Problem is something else and can also be seen at the current demo page, see:

    Home Page 9 Demo Legenda Theme

    As i can see the problem is the following:
    Look at the first Image (Woman)-/Text (“The last chance to buy winter Collection!”) Row in the DOM:

    The <div> width class “et_section” holds the background image (an image where te left side is blank and the otherside contains the image of the woman) – this image is set to “cover”.

    As u scale down, this works until around 1213px, but if u scale more this cant work like as expected (i would expect that the image goes above or down the text in mobile) because it´s still one image and the text area is an overlay of this image – so in my opinion there must be a change on the markup for mobile devices to archive my expectation.

    Can u provide me a solution for my expectation? How to archive this?

    Its really not working really responsive (its just scaled…) and if u scale down to…say for example 325×1007px the image of the woman is hidden because it´s on the right side and out of the viewport…

    Need to fix this as soon as possible – please.

    Avatar: Eva
    Eva Kemp
    Support staff
    February 5, 2016 at 11:48

    Hello @graebermedien,

    Try to add this code in custom.css file:

    .content.span12 .et_section {
       background-size: contain;
    }

    How to create custom.css you can watch in this tutorial

    Regards,
    Eva Kemp.

  • Viewing 9 results - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.