单元格高度是在webkit浏览器中忽略的东西

我试图与tbody和andad高度一起玩，事实证明webkit与其他浏览器相反，并不像我预期的那样运行。单元格高度是在webkit浏览器中忽略的东西

我已经设置了td高度。

Here is什么我谈论

how it rendered in webkit

enter image description here

的问题是 - 它的浏览器能正常运行，而且即使WebKit的渲染正确的，我怎么可以把它渲染的项目，就像在非webkit浏览器中？

来源

2012-04-25 shabunc

不要将高度设置为TABLE和TD。选一个。

来源

2012-04-25 20:49:02

那么，如果我只是想有一些空间没有底部由于某种原因的情况下 - 像这样）））） – shabunc 2012-04-26 05:43:06

在这种情况下，将它包装在一个DIV，并让表折叠到顶部。这可以让您在浏览器中保持一致的外观。 – 2012-04-26 13:20:18

我已经做到了，只有在它发布这个问题后）））问题是关于如何解决它没有任何额外的布局。 – shabunc 2012-04-26 13:22:01

为您的单元格，使用最小高度而不是高度或两者。

table { 
    border: 1px solid red; 
    height: 200px; 
    width: 400px; 
} 
thead td { 
    min-height: 10px; 
} 

tbody { 

} 

tbody td { 
    background: pink; 
    min-height: 10px; 
}

来源

2012-04-25 20:53:59 NotJay

好吧，它只是不工作 - http://dabblet.com/gist/2496312 – shabunc 2012-04-26 05:45:10

代码中有其他东西吗？因为它在我的所有浏览器中都能正常工作。也许其他一些风格或元素正在干扰这些细胞的特性？！？！否则，我会通过使用填充或div来解决问题。 – NotJay 2012-04-26 12:12:38

你在说什么http://dabblet.com/gist/2496312？嗯，这非常非常奇怪。 – shabunc 2012-04-26 12:30:37

如果你知道内部单元格的高度，那么你可以只插入一个伪元素表后：http://dabblet.com/gist/4332648

然而，在这种情况下，有像paddings等:)

更好的解决方案

所以，让我们假装我们不知道行数，但我们知道表的高度。如果我们能以某种方式为它保留位置，那么我们可以使该表绝对定位，插入非常高的伪元素并使用clip来移除不需要的空间：http://dabblet.com/gist/4332690。如果我们需要一个边框，那么另一个伪元素将会有所帮助 - http://dabblet.com/gist/4332702。

我担心，只有黑客可以模拟你想要的，而没有其他理想的解决方案。

来源

2012-12-18 22:36:17 kizu

单元格高度是在webkit浏览器中忽略的东西

回答

相关问题