谷歌Chrome浏览器的CSS对齐问题

我的桌子有点小问题。这只会在Google Chrome中发生。我想让我的标题复选框与我的表格的所有复选框对齐。一切工作正常，在IE浏览器& Chrome浏览器直到我添加css table-layout：fixed;。你可以看到下面的结果。在Chrome上，标题复选框不再与我表格中的所有其他复选框对齐。谷歌Chrome浏览器的CSS对齐问题

Page displayed with Internet explorer Page displayed with Google Chrome

这里是我的CSS：

table.search-results 
{ 
    border-collapse: collapse; 
    table-layout:fixed; 
    width: 100%; 
} 

table.search-results td.tipsy-empty { width: 5px; } 
table.search-results td.tipsy  { width: 5px; } 
table.search-results td.checkbox { width:20px; } 
table.search-results td.favoricon { width:20px; } 
table.search-results td.idaffaire { width:50px; } 
table.search-results td.information { width:auto; white-space:nowrap; overflow:hidden; } 
table.search-results td.username { width:50px; }

任何帮助是极大的赞赏。

来源

2011-04-19 Bronzato

在jsFiddle中发布一些HTML和CSS，它会更容易帮助你。 – cdeszaq 2011-04-19 17:31:41

@cdeszaq：不幸的是，我试图在jsFiddle中重现问题，但没有成功。该页面非常复杂（至少对我来说）。我是初学者，对不起。 – Bronzato 2011-04-19 19:18:10

使用CSS复位：http://developer.yahoo.com/yui/reset/

它看起来像浏览器有这些元素不同的默认CSS设置。总是使用CSS重置，不要让浏览器控制你:)

如果您使用的是Webkit圆角，也可能是问题所在。注意彩色标签是如何被推出的。 IE不支持这些圆角，这就是它们出现的原因。检查Safari，我敢打赌，这是你的问题。找到一个非圆角的css方法。他们可能有点难看，但他们阻止这样的事情。

来源

2011-04-19 18:09:41 stewart715

我尝试CSS重置，但没有帮助。不管怎么说，还是要谢谢你。图为 – Bronzato 2011-04-19 18:46:21

。我认为你的问题在于圆角。如果您仍然遇到此问题，请移除圆角并查看是否解决了您的问题。如果是这样，找到一种方法来添加没有webkit的圆角。 – stewart715 2011-04-20 04:04:26

谷歌Chrome浏览器的CSS对齐问题

回答

相关问题