Fixed background cover becomes zoomed in mobile view

css, html, interface, mobile

Solution

I solved my problem by limiting the capability to the large tablet screen size.

@media screen and (max-width: 992px) {
    #parallax {
        background-attachment: scroll;
    }
}

Problem

I'm using a fixed background cover for my website here: http://www.datisdesign.com Every page has a big header image, but in small devices such as mobiles, the cover image becomes so large. I want to make it smaller in mobile devices. This the code that I'm using: ``` #takelessons { background: url(../img/portfolio/takelessons-intro.jpg) no-repeat; background-attachment: fixed; background-size: cover; background-position: center top; } ```

Original source