Home Forums Free Themes Construction Base Background image not responsive

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #59773
    BarretD
    Participant

    Hello. I’ve tried pretty much almost everything, but so far I haven’t been able to get the background image to show responsively. It shows the top left corner of the image only. I don’t know what else to do. Any ideas?

    #59786
    wensolutions
    Keymaster

    Hello @barretd,

    When we tested the theme locally the background image is working fine in responsive view as well.

    So can you post your site URL so that we could inspect further??

    Hope you understand.

    Best Regards!!

    #59790
    BarretD
    Participant

    Thanks for the quick reply. Url is winnipegplumbingheating.ca. I would seriously appreciate anything you can do for me. On the preview within the theme, mobile looks good but when it’s on an actual phone, only the top left of the image is shown (and image is not reduced). Been trying so many things, I think I confused myself. Thanks

    #59812
    wensolutions
    Keymaster

    Hello @barretd,

    In the responsive view, you cannot view full image as some of the parts get cropped to adjust the image in responsive view.

    Currently left part of the image is displayed cropping the other part but if you want to display the center part of the image then you can use below given CSS.

    Go to Admin Panel > Appearance > Customize > Additional CSS and paste below given CSS.

    body.custom-background {  
        background-position: center !important;
        }

    Hope this helps.

    Best Regards!!

    #59877
    BarretD
    Participant

    Thanks for the help. Unfortunately, it is exactly the same as before. Judging by the time I’ve spent on this singular issue, I might be best off changing themes. Unless, you have any other ideas? Thanks in advance.

    #60061
    wensolutions
    Keymaster

    Hello @barretd,

    When we inspected your site URL the CSS is working absolutely fine. Currently, it displays the background image cropping the center part.

    However, if you are fine with displaying full image but in small height then once try using below-given CSS.

    @media (max-width: 767px){
    body.custom-background {
        background-size: contain !important;
       }
    }

    Hope this helps.

    Best Regards!!

    #60135
    BarretD
    Participant

    Thanks for the suggestion, but all it did was make the image pretty much disappear. There was a very thin line at the top probably no more than a few pixels high, and then just white space where the image was supposed to be.
    I appreciate everything you’re doing to try to help me, but as I am using the free version of the theme, I totally understand if you don’t want to put forth anymore effort in finding the cause of this issue.
    If however, you want to continue, I would be open to giving you access to the backend so you could take a deeper look.
    Honestly, it’s completely up to you. Thanks very much.

    #60258
    wensolutions
    Keymaster

    Hello @barretd,

    We would like to apologize for the inconveniences.

    But this is how the theme works in responsive view. The image will get cropped and there is nothing much we can do with the background image.

    Hope you understand 🙂 .

    Best Regards!!

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