Bootstrap左右padding、左右margin不生效问题排查求助

问题原因 #

你使用的pl-*、pr-*、ml-*、mr-*这类水平方向间距类是Bootstrap 4的旧语法，若你引入的是Bootstrap 5版本的样式文件，这类旧命名的类已被官方移除，因此不会生效。
Bootstrap 5为了适配从右到左书写的语言布局，调整了水平方向间距类的命名规则：

• 原表示left的l替换为s（start，指代阅读方向的起始侧）
• 原表示right的r替换为e（end，指代阅读方向的结束侧）
  上下方向的pt-*、pb-*，以及整体p-*、垂直方向py-*的命名规则没有调整，所以你之前设置的这类样式可以正常生效，仅水平左右方向的旧命名类失效，完全符合你遇到的现象。

对应替换规则 #

修复方案 #

将你代码中.col-4上的pl-5替换为ps-5即可生效，修改后的代码示例：

<div class="col-4 ps-5 blue">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit. Molestias, quos. ipsum dolor sit amet, consectetur adipisicing elit. Beatae, alias.
</div>

如果需要同时设置左右内边距，也可以直接使用px-*类，不需要分别设置ps和pe。

内容的提问来源于stack exchange，提问作者Ayan