CSS表显示差异 - Chrome与Firefox [英] CSS Table Display Differences - Chrome Vs Firefox

问题描述

我最近注意到，我的网站是破碎的chrome虽然在Firefox中显示良好。在我的网页上学习了HTML和CSS -

实际上，Chrome的行为正确：td高度150px + padding 15px（x2）= 180px。

Firefox在向td添加填充时会计算错误。

因此，最好的做法是删除单元格上的填充，保证金。

I recently noticed that my site is broken in chrome despite displaying well in firefox. Having studied the HTML and CSS at my page -

http://www.designlagoon.com/what-we-do/

There is a larger gap below the 4 blue titles in chrome than in firefox - which is breaking the frame of the containing box. This seems to be related to padding / margin of the table layout i´m using but I'm struggling to work out a fix.

If anyone can shed some light on what might be causing the problem i'd really appreciate it!

解决方案

This is related to a question I posted yesterday: Firefox: wrong interpretation of box model?

Actually, it's Chrome that's behaving correctly: td with height 150px + padding 15px (x2) = 180px.

Firefox does a miscalculation when adding padding to td.

So your best shot would be to remove the padding on the cells, and add a margin to their contents instead.

这篇关于CSS表显示差异 - Chrome与Firefox的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！