What do "s" and "e" stand for in the Bootstrap 5 spacing utility classes?

user_5351311 0
Viewed 1571

Bootstrap 5 documentation for the spacing utility classes states:

Where sides is one of:

  • t - for classes that set margin-top or padding-top
  • b - for classes that set margin-bottom or padding-bottom
  • s - for classes that set margin-left or padding-left in LTR, margin-right or padding-right in RTL
  • e - for classes that set margin-right or padding-right in LTR, margin-left or padding-left in RTL

So, for a small bit of left padding, you'll use the class ps-1 in Bootstrap 5, where it used to be pl-1 in Bootstrap 4.

I assume they changed this so it would be less confusing for RTL languages, but I can't for the life of me think of what s or e would stand for. I'm never going to remember "s is left" without actually understanding what metaphor the s/e stand for.

So, what do s and e stand for?

bootstrap-5
2 Answers

Start

and

End

This is so to make using RTL simpler. In default LTR, Start is Left, and End is Right.

Admin1

"I assume they changed this so it would be less confusing for RTL languages, but I can't for the life of me think of what s or e would stand for. I'm never going to remember "s is left" without actually understanding what metaphor the s/e stand for."

As explained in Bootstrap docs...

"...replace direction properties like left and right in favor start and end. That makes the class names and values appropriate for LTR and RTL"

user_1714560
Related