"If a worker wants to do his job well, he must first sharpen his tools." - Confucius, "The Analects of Confucius. Lu Linggong"
Front page > Programming > How can I align text in tables using Twitter Bootstrap?

How can I align text in tables using Twitter Bootstrap?

Published on 2024-11-15
Browse:828

How can I align text in tables using Twitter Bootstrap?

Table Text Alignment in Twitter Bootstrap

In Twitter's Bootstrap framework, you can align text within tables using designated text alignment classes.

Bootstrap 3

  • text-left: Left aligned text
  • text-center: Center aligned text
  • text-right: Right aligned text

Bootstrap 4

  • text-xs-{left|center|right}: Align text for all viewport sizes
  • text-{sm|md|lg|xl}-{left|center|right}: Align text for specific viewport sizes

Bootstrap 5

  • text-start: Left aligned text (replaces text-left)
  • text-end: Right aligned text (replaces text-right)

Example:

Align the total in a table cell to the right:

Total
$1,000,000.00

Additional Notes:

  • The provided examples align text within table headers (th) and data cells (td).
  • Refer to the official Bootstrap documentation for more detailed information on text alignment classes.
Latest tutorial More>

Disclaimer: All resources provided are partly from the Internet. If there is any infringement of your copyright or other rights and interests, please explain the detailed reasons and provide proof of copyright or rights and interests and then send it to the email: [email protected] We will handle it for you as soon as possible.

Copyright© 2022 湘ICP备2022001581号-3