The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS [Solved] Absolute positioned background not working on mobile devices

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • #234811


    Thanks in advance for you time, I’m experiencing a problem with the mobile view on this website I made:

    If I resize my browser window on desktop if works perfectly, but when I view the website on my iPhone for example I see this:

    The full width section “Waar kunnen we u mee helpen?” has a before selector with the background image. CSS:

    .Service.Overview {
    position: relative;
    z-index: 2;
    .Service.Overview:before {
    content: ”;
    background: url(inc/img/service-bg.jpg) no-repeat center center;
    background-size: 100% auto;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    top: 0;
    left: 50%;
    width: 3000px;
    margin-left: -1500px;
    bottom: 0;
    position: absolute;
    z-index: -1;
    display: block;

    What can I do to fix this?

    Kind regards,
    Xam Hanegraaf


    Adding overflow:hidden; to the container sort of fixed it, but now the full width on desktop is gone ofcourse.

Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘CSS’ is closed to new topics and replies.