The .text-center class in Bootstrap is employed to horizontally centre-align text or content within its parent element. It ensures that text and other inline or inline-block elements are centred within their container, providing a visually appealing layout.

Syntax:

<div class="text-center">
  <!-- Text or content to be centered goes here -->
</div>

Explanation: When applied to a <div> or other block-level element, the .text-center the class centres the text or content within that element horizontally. This class is especially useful for aligning headings, paragraphs, buttons, or other content elements in the centre of a container, improving the overall visual balance and alignment of the webpage.

Features

• .text-center class centres text or content horizontally.
• Ensures consistent alignment and readability.
• Responsive design adapts to different screen sizes.
• Enhances visual appeal and user experience.

Ref: /archive/bootstrap-5-text-alignment/