Skip to content

Drop .text-justify class #29793

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 7 commits into from
Dec 30, 2019
Merged

Drop .text-justify class #29793

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
0a4090f
Drop `.text-justify` class
MartijnCuppens Dec 2, 2019
324b3b2
Document `.text-justify` removal
MartijnCuppens Dec 2, 2019
208e786
Typo fix
MartijnCuppens Dec 13, 2019
cfffdd0
Merge branch 'master' into master-mc-remove-text-justify
XhmikosR Dec 25, 2019
d3d88a3
Update migration.md
XhmikosR Dec 30, 2019
af45aa3
Merge branch 'master' into master-mc-remove-text-justify
XhmikosR Dec 30, 2019
65191cf
Update text.md
XhmikosR Dec 30, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion scss/_utilities.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -377,7 +377,7 @@ $utilities: map-merge(
responsive: true,
property: text-align,
class: text,
values: left right center justify
values: left right center
),
"color": (
property: color,
Expand Down
1 change: 1 addition & 0 deletions site/content/docs/4.3/migration.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,6 +65,7 @@ Changes to Reboot, typography, tables, and more.
- Simplified table styles (no more 2px border on `thead > th` elements) and tightened cell padding.
- Dropped `.pre-scrollable` class. [See #29135](https://github.com/twbs/bootstrap/pull/29135)
- `.text-*` utilities do not add hover and focus states to links anymore. `.link-*` helper classes can be used instead. [See #29267](https://github.com/twbs/bootstrap/pull/29267)
- Drop `.text-justify` class.

## Forms

Expand Down
12 changes: 5 additions & 7 deletions site/content/docs/4.3/utilities/text.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,13 +8,7 @@ toc: true

## Text alignment

Easily realign text to components with text alignment classes.

{{< example >}}
<p class="text-justify">Ambitioni dedisse scripsisse iudicaretur. Cras mattis iudicium purus sit amet fermentum. Donec sed odio operae, eu vulputate felis rhoncus. Praeterea iter est quasdam res quas ex communi. At nos hinc posthac, sitientis piros Afros. Petierunt uti sibi concilium totius Galliae in diem certam indicere. Cras mattis iudicium purus sit amet fermentum.</p>
{{< /example >}}

For left, right, and center alignment, responsive classes are available that use the same viewport width breakpoints as the grid system.
Easily realign text to components with text alignment classes. For left, right, and center alignment, responsive classes are available that use the same viewport width breakpoints as the grid system.

{{< example >}}
<p class="text-left">Left aligned text on all viewport sizes.</p>
Expand All @@ -27,6 +21,10 @@ For left, right, and center alignment, responsive classes are available that use
<p class="text-xl-left">Left aligned text on viewports sized XL (extra-large) or wider.</p>
{{< /example >}}

{{< callout info >}}
Notice we don't provide utility classes for justified text. While, aesthetically, justified text can look more appealing, it does make word-spacing more random and therefore harder to read.
{{< /callout >}}

## Text wrapping and overflow

Wrap text with a `.text-wrap` class.
Expand Down