计算元素的margin-top

Question

我需要从顶部放置100px边距的文本，如下所示：

有谁知道怎么做？字体大小是24pt，粗体。

Answer 1

根据CBroe在评论中提出的建议，解决方案似乎是一个100px高的div，底部有一个绝对定位的文本元素（比如一个副本）。

我已经将行高调整为/ .66em，因为这似乎可以将文本与大多数字体大小对齐。

* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
div {
  height: 100px;
  border-bottom: 1px solid lightgrey;
  position: relative;
}
div p {
  font-size: 24pt;
  font-family: serif;
  line-height: .66em; /* possible "magic number" */
  position: absolute;
  bottom: 0;
}

<div>
  <p>Contacts</p>
</div>

Answer 2

我使用的容器div位于距离顶部100px处。

容器内的另一个div，包含文本，绝对定位为bottom:100%;，似乎可以正常工作

HTML：

<div class="textWrapper">
    <div class="text">Contact</div>
</div>

CSS

.textWrapper {
    position:relative;
    margin-top:100px;
    display:block;
    border-bottom:1px dashed #333;
}
.text {
    position:absolute;
    bottom:100%;
    background:#aaa;
    display:block;
}

JSFiddle