Argent header being cropped on large screen

Here is screen shot of the issue:
https://www.dropbox.com/s/gl8mqv48y062bzj/160511_cropped%20header.jpg?dl=0

Hi there – I’m not quite clear on the problem.

When you say “the header image does not resize” can you explain in more detail what you expect to see vs. what you’re actually seeing? Thanks.

I think it because your background image is set to background-size:cover. When the image gets smaller the cover attribute adjust the the image to fit your header. Your width is changing but the height remains the same so the appearance at different screen sizes change as well.

You could probably over come this by adding a media query to change the image to a smaller image or adjust the image height at a given break point.

Hi and thanks to both of you for your response. mrtom414 your answer is a bit technical for my “beginner” status, sorry!

For clarity, Kathryn, I’m posting a screenshot of how the site looks on a standard laptop screen and correctly shows my background elevational drawing in full:
https://www.dropbox.com/s/d1rz7qycxuzm2uj/160516_header%20as%20seen%20on%20a%20standard%20laptop%20type%20screen.png?dl=0

Here is a screenshot of the same page seen on a larger screen. The background elevational drawing is cropped. The header doesn’t seem to resize to fit the larger screen size:
https://www.dropbox.com/s/pi34slo46j9qxn8/160516_header%20as%20seen%20on%20a%20larger%20screen.png?dl=0

Thanks again.

Are you referring to the header or the slider ?

The green header saying “Hann Design Studio”. Thanks

Thanks for the screenshot. The header in Argent does stretch and crop automatically at different screen sizes, so it’s best to use an image that has some flexibility with that in mind. it works well with abstract or patterned images, for example.

Otherwise, you could try experimenting with the CSS as mrtom414 suggested. If you’re a beginner you might want to get some pro help to get it looking exactly as you want.

ok, thanks so much to you both. Kate