如何在bootstrap5中进行左填充？

Question

在 bootstrap4 中，我们使用 pl-5 进行左填充，在 bootstrap5 中它不起作用。

<div class="col-md-6 col-9 p-3 pl-5"> in bootstrap5 this code is not working

Answer 1

根据文档，类名称是ps-or pe-... 意思是开始/结束而不是左或右。

原因是，如果您从 RTL 切换到 LTR 站点，您的填充仍然会从正确的一侧应用。

<div class="ps-2">I have a padding left on LTR and a padding right on RTL languages</div>

Answer 2

在 bootstrap-5 中，pl 和 pr 分别被替换为 ps 和 pe。

`

  <div className="col-md-4 pt-5 ps-3" style={colBorder}>Lorem ipsum dolor sit 


                         amet consectetur adipisicing elit. Quasi, sed!</div>


  <div className="col-md-4 pb-5 pe-5" style={colBorder2}>Lorem ipsum dolor sit 


                         amet consectetur adipisicing elit. Quasi, sed!</div>


</div>

`