Mobile version displays cut off version of header image

[candleman1]

In my desktop version on my website www.candlesforkarma.com the header image is perfect, but when I try it on a mobile device it is cut off significantly. How do I make it work? I've seen many weebl websites that have an image like mine but it isn't cut off. 

[Queso]

Hey there! The background images will scale to the size of the viewing window. As a result, some of it may be cut off. However, an Image element would scale to fit the entire image in the available space. Have you tried setting it up as an element already?

[saloia82]

I'm having an extremely hard time getting my picture to fit properly when viewed on mobile. The re-sizing that's done on the mobile version is pretty much useless! It ends up cutting out the entire left side of my picture. I don't know what else to do, but it's such a shame that I actually found a them that I like (Haberdashery) and while it looks great on desktop the mobile version is terrible! Seeing that most of my customers are viewing on mobile this really is a huge issue for me.

[Adam7]

Sometimes you can improve things with some CSS tweaks, although that can be a little complicated if you aren't familiar with CSS and HTML. The best images for header backgrounds and sections are those which have the most important parts of the image right in the middle of the image, so that it doesn't matter so much if some parts of the image are cut off on narrow screens.