Container Alignment To Specific Part Of Stretched Image (organic)

Ask the community
2
  1. I’m able to achieve horizontal alignment when setting up a grid within section with outer columns/rows given a viewport height/width. Depending on the size of the image it varies.

For instance:

  1. When height of image is let auto where width is 100% I get height alignment with container while resizing viewport

1531×729 84 KB

  1. When adjusting section to required height and having 100% width & height on image (basically stretched), i do achieve vertical alignment.

1791×726 113 KB

I tried setting something in between those values but there’s no sweet spot obviously since this is meant to be responsive. Giving the image a fixed pixel height does not work either.