Header Image Not Mobile Responsive

The header image is not mobile responsive. It looks OK on a computer.

But, on a phone it zooms in and crops the sides off. It looks terrible.

My website is: www.scriptdbox.com

I searched the forums and found a post that said to try this in the additional CSS:

@media only screen and (max-width: 1242px) {
#header {
background-attachment: initial !important;

But it doesn’t help at all. What else should I try? I just want the image to be scaled down and look the same on mobile as it does on the desktop.


Any suggestions?

Is it possible to scale down the image on mobile platforms? Or use a different image altogether?

Hey there,
Hope you’re doing well today

My sincere apologies for the late reply.

I’m currently on your site and everything looks pretty good from my end (see screenshot)

If things are looking differently from your end, kindly clear your browser cache and then send me a screenshot if it’s still looking off.

I look forward to your reply :slight_smile:

Best Regards,