Google Chrome的CSS对齐问题

Question

我的桌子有点对齐问题。 这仅在Google Chrome浏览器中发生。 我想使标题复选框与表格的所有复选框对齐。 在我添加css table-layout：fixed;之前，一切在IE和Chrome上都能正常运行。 。 您可以在下面看到结果。 在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;  }

任何帮助是极大的赞赏。

Answer 1

使用CSS重置： http ： //developer.yahoo.com/yui/reset/

看来浏览器对这些元素具有不同的默认CSS设置。 始终使用CSS重置，不要让浏览器控制您:)

如果您使用的是Webkit圆角，也可能是问题所在。 注意如何将彩色标签推出。 IE不支持这些圆角，这就是为什么它们应有的外观。 检查Safari，我敢打赌这是您的问题。 查找圆角的非css方法。 它们可能有点丑陋，但可以防止此类情况。