将绝对值放置在chrome中的显示表元素内时,1px间隙

时间:2012-05-17 10:39:56

标签: css layout css3

这是我的第一个问题。

我试图让一个元素在具有固定宽度和高度的父元素内垂直对齐。在父框内部还有一个标题,需要绝对位于底部。

在处理它时,检查跨浏览器问题我看到了chrome的差异。在FF,IE 8& 9它可以正常工作,如果你在Chrome中打开样本(现在是19),它会给你父母一个1px的空隙。你可能会看到。

Interactive example of the problem - CSSDeck

How I see it - 1px gap

我试过删除空白区域,还有很多东西,但是我无法消除这个空白......

这是一个错误吗?如果你可以帮助我消除差距,或者以一种干净的方式实现相同的结果,那就是跨浏览器(ie8 +),那就太棒了。

1 个答案:

答案 0 :(得分:0)

请参阅我的示例小提琴:http://jsfiddle.net/tnRem/

基本上我从display: table删除了#outer,并将height: 250pxbox-sizing: border-box;(仅限IE8 +)设置为#inner

我尝试使用Chrome 19.0.1084.46,Fx12和IE8