如何把一个p放在div的中心？

Question

我有一个弹出窗口，<p>内有2个<div> div有padding-left＆amp; padding-right我希望将p标记放在div的中心。我应该怎么做？

这是代码：

<div class="sign"><p class="sign_text"> ' + sign + '</p> <p class="sign_text"> ' + this.sender + '</p> <div>

风格

'.sign{padding-left: ' + this.sign_padding_left + ';' +
  'padding-right: ' + this.sign_padding_right + ' +; font-family: IRANSharp;}' + 
  '.sign_text{margin-bottom: 0px; text-align: center}</style>'

Answer 1

添加此css

.sign{
  display: flex;
  flex-direction: column;
  justify-content: center; // align horizontally center
  aligns-items: center;  // align vertically center
}

编辑1：根据您添加的图片

.sign{
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
}

p{
  display:block;
  text-align:center;
  width: 80%; /*Change this for left adjustment*/
}

Answer 2

这对我来说非常适合用于flexbox。

尝试这样的事情：

div {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

p { // use a class obviously
  display: inline-block;
}

这是flexbox https://css-tricks.com/snippets/css/a-guide-to-flexbox/

的绝佳资源

Answer 3

添加{display：block; } .sign class然后text-align将起作用。