Why Is My Text Not Centering in Bootstrap 4's Columns?

Text Alignment Issue with col-xs-* in Bootstrap 4

When attempting to align text to the center of a column in Bootstrap 4 using col-xs-12, the alignment fails. This behavior differs from earlier versions of Bootstrap.

Explanation

In Bootstrap 4, the col-xs-* classes have been deprecated in favor of col-*. To achieve the same effect as col-xs-12, use col-12 instead.

Solution

Replace the following line:

<div class="col-xs-12 text-center">

with:

<div class="col-12 text-center">

Additional Notes

• The col-xs-offset-{n} classes have also been replaced by offset-{n} in Bootstrap 4.
• Ensure that the necessary CSS and JavaScript files for Bootstrap 4 are included in your code.

The above is the detailed content of Why Is My Text Not Centering in Bootstrap 4's Columns?. For more information, please follow other related articles on the PHP Chinese website!