使用CSS执行断字后添加缩进

Question

我想为断字后移至新行的文本添加缩进。当前，它甚至不考虑给父对象提供的padding-left，并且在分词后显示在最左侧。

在上图中，您可以看到权限行正在断字，而0 ...则粘在左侧。我希望它显示在P的第一个字母下方或之后。

  position: relative;
  left: 76%;
  top: -755px;
  width: 22%;
  height: 508px;
  color:rgb(3, 3, 3);
  background-color: #bdddf0;
  z-index: 10;
  border-style: groove;
  border-radius: 10px;
  padding-top: 15px;
  padding-right: 3px;
  line-height: 1.5;
  margin: 15px;
  overflow: auto;
  max-height: 630px;
  overflow-wrap: break-word;
  word-wrap: break-word;
  font-size: 15px;
  h2 {
    margin-bottom: 2%;
  }

.SummaryPanel是父元素的className。 如何控制自动换行和缩进？有可能控制它吗？

Answer 1

您必须像下面那样在您的summarypanel类中添加text-indent属性

    padding-left: 2em;
    text-indent: -2em;

示例：https://jsfiddle.net/9phwnxby/1/

希望有帮助