Is it possible to justify text within the bootstrap framework?

You can add to your main.css, custom.css, or whichever *.css file you have made, or to the top of bootstrap.css file directly:

.text-justify {
  text-align: justify;
}

If you add this to the bootstrap.css file direcetly, as of v3.0.0, it would go from this:

/*!
 * Bootstrap v3.0.0
 *
 * Copyright 2013 Twitter, Inc
 * Licensed under the Apache License v2.0
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Designed and built with all the love in the world by @mdo and @fat.
 */

/*! normalize.css v2.1.0 | MIT License | git.io/normalize */

article,
aside,
details,
...
...
…

to

/*!
 * Bootstrap v3.0.0
 *
 * Copyright 2013 Twitter, Inc
 * Licensed under the Apache License v2.0
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Designed and built with all the love in the world by @mdo and @fat.
 */

/*! normalize.css v2.1.0 | MIT License | git.io/normalize */

.text-justify {
  text-align: justify;
}

article,
aside,
details,
...
...
…

No. But you can add a new class on bootstrap.css

.text-justify {
  text-align: justify;
}

Update

Previous versions of bootstrap was not supporting text-justify. But bootstrap 3 has added a class text-justify.


In Bootstrap 3 and Bootstrap 4 you can use the following:

<p class="text-justify">Justified text.</p>

Official documentation

(Update) This feature removed from Bootstrap 5

  • Commit
  • Official document and recommendation

Note that we don't provide utility classes for justified text. While, aesthetically, justified text might look more appealing, it does make word-spacing more random and therefore harder to read.

Based on the official UX suggestion: don't use justified text! ;)