No responsiveness for text-justify?

[ghost]

According to the docs @ https://getbootstrap.com/docs/4.3/utilities/text/#text-alignment, we can create breakpoints for aligning text i.e. text-left, text-sm-left, text-xl-center etc.

There is a text-justify class for all breakpoints, but there are no individual break points? Why hasn't this been added with the other alignment classes?

For example, on mobiles a block of text looks better to be centred, but anything larger should be justified. This could easily be achieved by using text-center text-sm-justify, to work along the lines of all the other alignment classes.

[MartijnCuppens]

The responsive text-justify classes will be added to v5 thanks to our new utility API:

bootstrap/scss/_utilities.scss

Lines 376 to 381 in 741b08e

	"text-align": (
	responsive: true,
	property: text-align,
	class: text,
	values: left right center justify
	),

We can however update our docs a bit, since the justify class have a seperate section in our docs (https://twbs-bootstrap.netlify.com/docs/4.3/utilities/text/#text-alignment)

Feel free to open a PR for this.

[mdo]

Justified is terrible type in general, I'm inclined to make it not available as a utility at all in v5 honestly. Anyone have good examples for where it's a good experience?

[ghost]

Do you have a personal vendetta against me?

I can’t believe what you’ve just said. That’s very much your opinion. Would you honestly remove something just because you don’t use it?

That’s seriously incredibly unfair I’m absolutely shocked you would have a view like that.

You don’t see the point? Seriously?

[MartijnCuppens]

Justified is terrible type in general, I'm inclined to make it not available as a utility at all in v5 honestly.

Personally I don't like or use it either since justified is quite hard to read due to the varied word spacing. I'm ok with dropping this utility for this reason.

Do you have a personal vendetta against me?

@leecollings, we try to develop Bootstrap with keeping best practices in mind and need to make unpopular decisions at some points. But like @mdo mentioned above, if you have any examples where you've used justified text which would provide a reason to keep it, please share.

[ffoodd]

@leecollings FYI, justified text is a nightmare to read and is even a failure criterion in WCAG.

• F88: Failure of Success Criterion 1.4.8 due to using text that is justified (aligned to both the left and the right margins)
• Success criterion: G169: Aligning text on only one side
• And a least solution if you can't remove justification by yourself: G172: Providing a mechanism to remove full justification of text

To explain this a bit more, this is not really an accessibility concern but a readability one: justifying text makes word-spacing almost random, which turns to be more difficult to read. It's as simple as that.

It appears to be mentionned in WCAG because some users (especially dyslexics, but also low level reader for example) would be unable to read your content because of justification and not because of their trouble with reading.

FYI in our own fork (Boosted), we totally removed the .text-justify utility for those reasons — so I'd recommend Bootstrap does the same, obviously.

[ghost]

When used in columns or small widths, it is much more easier to read and aesthetically pleasing, which is my case scenario.

Newspapers all have their text fully justified.

I absolutely do not think it is a good idea to completely remove this, it should follow the other text alignment classes so that every scenario is catered for as and when the developer wishes to use them.

To remove them would be a very draconian move, forcing users what only you want them to have based on your own opinions.

[ffoodd]

In printed graphic design (such as newspapers), tools are literraly centuries in advance: you can manage kerning, letter-spacing or word-spacing per line, or per couple of words, or on a single word, but also advanced and manual hyphenation — all of this to reduce or handle words and letter spacings, making them (almost) invisible and well balanced.

Hyphens and per line styles handling are wanted in CSS for decades, and even if it's kinda showing up with hyphens it's not enough. This is still in discussion in #3164 of CSSWG and you can read some incoming features in CSS Text level 4 draft.

But for now and with currently targetted browsers, this is not trivial at all and should probably not be done.

[patrickhlauke]

i think it's worth taking a step back to clarify that yes, Bootstrap is opinionated ... it will make certain decisions (both in terms of look and feel, and in terms of which features/options is provides) that reflect the views of the core team first and foremost.

in light of this, yes...there will be many situations where a conscious decision is made not to include something, to remove something, etc. and yes, this will invariably annoy users, who feel that their most needed feature is not making the cut.

however...some pragmatic lines have to be drawn sometimes. and, since we're just talking some basic CSS, nothing stands in the way of users/authors making their own extra few rules/additions for their specific needs. it's unrealistic to expect Bootstrap core to be all things to all people, all the time.

[mdo]

Do you have a personal vendetta against me?
I can’t believe what you’ve just said. That’s very much your opinion. Would you honestly remove something just because you don’t use it?
That’s seriously incredibly unfair I’m absolutely shocked you would have a view like that.
You don’t see the point? Seriously?

I’ve no idea why you’d think I have a vendetta against you.

Justified text has a place, but it’s very very infrequently used in apps and sites, things folks use Bootstrap to build. Most online publications don’t justify their text—they left align it and let it run ragged right. We’re not designing for print, or even multi column text, and we’ve also removed our print styles in v5. Varied spaces between words doesn’t help readers in most cases, and sure hyphenation can help, but we also don’t have utilities for that either.

As some of the comments here state, we don’t do everything we’re asked and we try to use sensible defaults while providing appropriate amounts of customization and utility. I don’t see any of this as unfair or shocking.

[blueyetisoftware-jason]

I am really bummed that text-justify was removed. I was just getting ready to make the PR that @leecollings was requesting. I personally use it for the reasons listed above. In a design focused site, the margins and aesthetics are important. Any chance we can revisit this decision and reopen the issue?

[MartijnCuppens]

Accessibility > (opinionated) aesthetics. Bootstrap aims to be used as a framework to create accessible websites with (as explained by @mdo above)

That being said, it 'll be quite easy to add responsive variants in customized versions with the utility API in v5 (see https://github.com/twbs/bootstrap/pull/29793/files#diff-1d192d727d5709ecd8fef0b790aff5e8L380)