如何使Signature for acceptance文本与下方signature类p标签居中对齐

你可以通过以下两种方式实现需求：

方法一：使用Flex布局（推荐） #

给父容器.divsignature添加垂直方向的Flex布局，让子元素水平居中，同时保留整体右浮动的效果：

.divsignature{
  font-weight: bold;
  float:right;
  display: flex;
  flex-direction: column;
  align-items: center; /* 让子元素水平居中对齐 */
}

.signature{
  padding: 15px 30px 10px 0px;
}

HTML代码保持不变：

<div class="divsignature">
  <p class="signaturetext">Signature for acceptance</p>
  <p class="signature">__________________________________</p>
</div>

方法二：匹配内边距并设置文本居中 #

如果不想用Flex布局，可以给上方的.signaturetext设置和下方.signature一致的右内边距，再让文本居中：

.divsignature{
  font-weight: bold;
  float:right;
}

.signature{
  padding: 15px 30px 10px 0px;
}

.signaturetext{
  text-align: center;
  padding-right: 30px; /* 和下方p标签的右内边距保持一致 */
}

以上两种方式都能让"Signature for acceptance"文本相对于下方的横线居中对齐，同时整体保持在屏幕右侧。

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