Home / Forums / ePix Support / Homepage responsiveness

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts

  • Jezus
    Participant

    Hello my friends :),

    Could you please help me find a way to make the home page work on all devices?
    I was expecting this would become challenging.

    http://marinos178.178.axc.nl

    I used a wide background image in the inner row, to make the links fit on desktop, but on other devices it doesn’t contain proportions.

    I was hoping to be able to put the links & picture in a content box or row, to make it contain proportions on every device.

    Please let me know if that is possible.
    If not, do you have a better solution to make this design responsive?

    A lot of thanks in advance!

    Hi @jezus

    Are you referring to the colorful cube image on your homepage?

    If yes, the best option would be to set the position of the background image.

    Add this CSS to the page:

    .vc_row.wpb_row.vc_inner.row.vc_custom_1483712987760.vc_row-has-fill.vc_row-o-content-middle.vc_row-flex {
        background-position: center !important;
    }

    Thanks!


    Jezus
    Participant

    Thanks, that sounds hopeful
    where exactly do I add CSS to a single page?

    Hi @jezus

    You just have to edit the post and click on the ‘gear’ icon.

    I have sent a screenshot to where exactly it is located. See here: http://tinypic.com/r/bhlh7q/9

    Regards,


    Jezus
    Participant

    thanks, it works 🙂

    Glad to know it works, @jezus


    Jezus
    Participant

    Hello,

    I’m back again with a new question about this subject:

    I added a video background to this page. To make it work I changed the picture from .jpg to .png (with a transparent BG). After that the css code to keep the picture in place, seems to be failing for tablet and smart phone. (important: both pictures have the same name, the only difference is the extention jpg/png)

    Is it correct that the css code includes the name/url/id of the .jpg picture?

    Funny thing is: After putting the original jpg picture back later on, the code still doesn’t work.

    I tried everything I could and I hope you can help me make the picture of the cubes stay in place on all devices again. (And maybe explain me how to change the code in the future)

    My thankfulness is huuuuge!!!

    The CSS applied was specific for the row where the background image was added.

    You actually moved the background image to an inner row which has a different class name, and this is why the CSS did not work.

    I have updated the CSS and the image is now centered on mobile.

    Please check if everything looks good from your end.

    Thanks!


    Jezus
    Participant

    it works perfect!
    thanks a lot.

    You’re welcome, @jezus

    Please don’t hesitate to contact us if you encounter any issues.

    Regards,

Viewing 10 posts - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.