Hi there.
I’m trying to centre a heading and paragraph in one row, and an image in the other nicely in the middle of the view port. Despite trying many options in flexbox etc I can’t seem to make it look centred properly and on mobile the text does not wrap properly. Can anyone help?
Here is how it’s currently structured.
On the container add following classes
d-flex min-vh-100 align-items-center justify-content-center
on the row add this class w-100
on the heading add this class text-center
.d-flex: Turns the container into a flexbox wrapper.min-vh-100: Forces the container to take up at least 100% of the viewport height so there is vertical space to center within.align-items-center: Vertically aligns the rows/columns right in the center.justify-content-center: Horizontally aligns the content.w-100: Added to the row to ensure it stretches fully across its parent container instead of collapsing..text-center added to the heading center the heading text