Hero Image Responsiveness/auto fit

Developing with Concrete
1

Hey all, not sure if this should be here or in the Working with Concrete/Help section or the bug section. Feel free to move it if need be.

I love the versatility of the new Atomik theme, it’s great for us to use with clients on a minimum budget but still want a little “extra.”

The issue I seem to be having has to do with the responsiveness and fitting of images into the Hero Block.

Whenever I add images, they always seem to cut off at the top and bottom rather than “auto fitting” into the space. Is there something I’m missing to stop this from happening? Could it be that the image I want to use (400x270 pix) there is significantly smaller than the stock hero-01 image (2600x1214).

In the image below, there is text above the 100 years and below as well that is not showing.

Thanks - Joe

Screen Shot 2023-10-09 at 11.25.20
Screen Shot 2023-10-09 at 11.25.201920×907 65.8 KB

2

In order for the image to scale it just need more height. I think this is built for 4:3 aspect image.

If you wanted to get it working you could twerk the CSS, but that image is pretty small for a hero image.

3

Thanks for the response. I’ve changed images to something that matches the height of the stock image and it does the same thing. I’ve also noticed that if you have too much text in the Hero box, it flows into the containers below.