Question

我的h3高度为100%。因此高度未知。如何将文本置于其中心？为了这个例子，我已经给出了父固定尺寸，但事实并非如此。我尝试过使用垂直对齐，但这不起作用，我相信我可能需要更改display才能做到这一点？

我不想将文本置于其父级中心，我知道各种方法可以做到这一点。我想知道是否可以将其垂直居中。文本在两个维度中都必须为100％，以便链接填充父div。

.unknowndimensions{
  height:300px;
  width:300px;
  }
.unknowndimensions h3{
  height:100%;
  width:100%;
  background:#f7f700;
  text-align:center;
  }

<div class="unknowndimensions">
  <a href="#"><h3>Title</h3></a>
</div>

Answer 1

使用表格方法，

.unknowndimensions{
  height:300px;
  width:300px;
  }
.unknowndimensions a{ 
  display:table;
  width:100%;
 height:100%;
  }
.unknowndimensions h3{
  display:table-cell;
  vertical-align:middle;
  background:#f7f700;
  text-align:center;
  }

<div class="unknowndimensions">
  <a href="#"><h3>Title</h3></a>
</div>

垂直对齐文本本身

1 个答案: