The background images are clipping on mobile devices.

Please check the portfolio (3D Typography).

http://mindthemix.com/?portfolio=3d-typography

As a reference a video showing when resizing on a desktop browser

http://www.mindthemix.com/download/background_image_clipping_salient.movIs this an issue with the image size? What's the best work around?

Thanks in advance,

Thanks. Tried but the image has enlarged. I\'m on Safari

Hi,

Looks like this is causing the problem:

background-attachment: scroll!important;

@media only screen and (max-width: 1000px) and (min-width: 1px)

.wpb_row .row-bg, .full-width-section .row-bg {

margin-top: 0!important;

height: 100%!important;

transform: none!important;

-webkit-transform: none!important;

background-attachment: scroll!important;

}

When I disable \" background-attachment: scroll!important;\" it works fine:

@media only screen and (max-width: 1000px) and (min-width: 1px)

.wpb_row .row-bg, .full-width-section .row-bg {

margin-top: 0!important;

height: 100%!important;

transform: none!important;

-webkit-transform: none!important;

/* background-attachment: scroll!important; */

}

Thanks for the feedback.

I tried that but no fix on ipad or iphone. Safari resize the images with the fix but that\'s it.

Any additional help will be greatly appreciated.

Hi,

That media query doesn\'t target all resolutions/devices. That line should be removed from the other media queries as well. However, the support team should have a look at this. There\'s a reason why that line was added anyway.

That\'s the issue with this fix. I already open a private ticket with the support team. Thanks anyway!

You can close this ticket; I just resolved it with the support team.

Thanks so much for all your help guys!