html - 宽度未知的水平居中 block

Question

我有 3 个不同宽度的 block 。我希望每个 block 都水平居中，并且正文下方的文本也像 text-align:right 一样朝向正文。看图

怎么做？

图像 = http://www.nahraj-obrazek.cz/pt-313937842321.png

Answer 1

您可以使用display: table; 来达到您想要的效果。 <强> SEE THE DEMO 将 display: table; 定义到两个文本所在的 div 中，并通过应用 margin: auto; 将其居中。对于要右对齐的文本，请编写 text-align: right; 样式。就这样。

它的代码也更少。

AND DEMO FROM FIDDLE YOU PROVIDED

div {
  margin: 0 auto;
  display: table;
}
div p {
  text-align: right;
}