我设置了一个< div>的高度为20px,虽然在浏览器中呈现的只有14px高。
有任何想法吗?
<div style="display:inline; height:20px width: 70px">My Text Here</div>
解决方法
您不能设置高度和宽度的元素与display:inline ;.使用display:inline-block;代替。
10.6.1 Inline,non-replaced elements
The
height
property does not apply. The height of the content area should be based on the font,but this specification does not specify how. A UA may,e.g.,use the em-Box or the maximum ascender and descender of the font. (The latter would ensure that glyphs with parts above or below the em-Box still fall within the content area,but leads to differently sized Boxes for different fonts; the former would ensure authors can control background styling relative to the ‘line-height’,but leads to glyphs painting outside their content area.)
编辑 – 你也缺少一个;终结者的高度属性:
<div style="display:inline; height:20px width: 70px">My Text Here</div> <!-- ^^ here -->