删除填充，将文本对齐到div的顶部

Question

我目前正在创建打印CSS！ 因为我必须在模板上打印，所以我以mm为单位！

我的问题是如何看到红色文本未与白框的顶部对齐，看来白框有填充！ 我想让文字正好在红线下方1毫米处。 我试图给文本留出一个margin-top:1mm但文本停留在该位置！ http://jsfiddle.net/WkhPb我想保持mm为单位我必须更改什么？ 谢谢

我的html：

<div id="box">
 <div id="adress">
  <a>Das ist Box 1</a>
 </div>
</div>

CSS：

#box{
   height:40mm;
   width:90mm;
   background-color:yellow;
   padding-left: 6mm;
   padding-right: 5mm;
   padding-top: 2mm;
}

#adress {
    border: 1px solid red;
    width: 30mm;
    height: 20mm;
    background-color: white;
}

#adress a {
    color: red;
    font-size: 2mm;
    margin-left: 1mm;
    margin-top: 0mm;
    line-height: 0mm;
}

http://jsfiddle.net/WkhPb/

Answer 1

您需要在包含的div上添加3mm的行高，以匹配您的字体，并从所需的顶部开始为其设置1mm的边距。 您可能还希望在div的两侧放置一个填充，以免文本不正确。

#adress {
    line-height:3mm;
    padding:0 1mm;
}

Answer 2

您可以在链接上使用position : absolute

http://jsfiddle.net/WkhPb/3/

#adress a {
    color: red;
    font-size: 2mm;
    position:absolute;
    top:1mm;
    left:1mm;
}

和position:relative对于父项

Answer 3

删除浏览器应用的填充和边距，并将其设置为0；

其次，您必须将链接的显示属性设置为block或inline-block才能应用边距。

*{
  padding:0;
  margin:0;
 }


#address a{
 display:block;
}

演示场

Answer 4

您说：“我想让文字正好在红线上方 1毫米处 。”

小提琴

将您的CSS更改为：

#adress a {
        color: red;
        font-size: 2mm;
        margin-left: 1mm;
        margin-top: -2mm; /* changed */
        line-height: 0mm;
        display:block;  /* added */
    }

Answer 5

采用：

padding: 0px;

内部地址。