Tagged: ,

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • January 4, 2016 at 12:15 pm #559127
    ishafoundation

    Hi.
    In our website, the top image which is color section background image is not being responsive. We are unable to figure out what causes that. Can you please help.

    January 4, 2016 at 10:24 pm #559538
    Andy

    Hi ishafoundation!

    you can control it with this code inside of your Quick CSS field:

    @media only screen and (max-width: 767px) {
div#page-header {
background-size: 124% 71% !important;
background-position: 0px 0px !important;
}}

    adjust it as needed.

    Cheers!
    Andy

    January 14, 2016 at 2:17 pm #565394
    ishafoundation

    If I use the styling, width seems to take effect but height is static due to below styling that comes in.
    <div style=”height:600px” class=”hr hr-invisible avia-builder-el-1 el_before_av_countdown avia-builder-el-first “><span class=”hr-inner “><span class=”hr-inner-style”></span></span></div>
    The height will have lot of space after the image.

    January 14, 2016 at 3:19 pm #565420
    Andy

    Hey!

    not sure what you mean. Can you use screenshot to make things clear please? about which height value are you talking about? because there is no height value in my code I provided to you.

    Cheers!
    Andy

    January 15, 2016 at 7:03 am #565958
    ishafoundation

    Hi,

    Thanks for quick reply.

    Please find below the image showing the different screenshots.

    1) width 100% and height 70% looks OK but image will not be correct aspect ratio
    2) width 100% and height auto will make image show in correct aspect ratio but there lot of space due to styling as shown which comes from what we kept while editing color section

    Pls let me know if this is clarifying. I want image to show in correct aspect ratio, but no spaces like as shown.

    – Subba

    January 15, 2016 at 3:48 pm #566124
    Andy

    Hi!

    no theme can know which behavior of an image you want on different devices. Please provide us a mockup showing exactly what you are trying to achieve and we try to provide you with some precise CSS code.

    Best regards,
    Andy

    January 16, 2016 at 8:56 am #566497
    ishafoundation

    Hi,

    Did you go through the image I shared in previous post. Sharing again below. I have mentioned steps 1 to 4 what I did and what is the problem. I want height to adjust “auto” but no gap after the image.

    And the theme by default was responsive in terms of color sections, only recently it has come to our notice that it is not responsive, and thought it is a bug which you may have some idea. If you can see the image and specify the right css, it will help.

    Regards,
    Subba

    January 17, 2016 at 5:27 am #566717
    Rikard

    Hi,

    You are setting the height of one of the div’s inside the color section to 600 pixels making it look like that, could you try setting the preferred height to the color section instead? If you can’t work it out then please post admin login details in private.

    thanks,
    Rikard

    January 19, 2016 at 12:55 pm #567798
    ishafoundation

    Ok. If thats the default behaviour, then it is fine. Yes, adjusting it to “based on content” will correct it. The main problem was, even with that, width was responsive earlier, but now I can manage with the css styling provided. Thanks. Closing this.

    January 19, 2016 at 9:03 pm #568115
    Andy

    Hey!

    glad we could help. Let us know in a new ticket if you have some more questions related to the theme. We are happy to assist you.

    Cheers!
    Andy

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • The topic ‘Color Section Background image not responsive’ is closed to new replies.