Reply To: Vertically aligning a headline in a responsively cropped image

[Paulie_D]

Vertical alignment using position absolute is OK….it’s just that “top:50%” puts the top left corner of the element at 50% down from the top.

So you have to drag the element up by 50% of its own height.

You can do that with a transform:translateY(-50%);

http://codepen.io/Paulie-D/pen/EaowbP?editors=010

Also, remove any margin or padding from the heading.