有人可以向我解释为什么第一个div和第二个div之间有额外的3px空间:
http://jsbin.com/aSoRoC/1/edit
<body style="margin: 0">
<div style="background-color: green;">
<svg style="background-color: red; margin: 0; padding: 0;" width="600" height="40" fill="#f00"></svg>
</div>
<div style="background-color: blue; width: 600px; height: 40px;"></div>
</body>
如果你穿上height: 40px;第一个div 就可以修复,但我不明白为什么这是必要的.这种情况在Chrome,FireFox和IE中普遍存在.
SVG是内联元素,内联元素的默认垂直对齐是基线.
svg {
vertical-align: middle; /* or anything other than baseline */
}
| 归档时间： |
|
| 查看次数： |
97 次 |
| 最近记录： |