ber*_*rny 5 google-chrome column-width padding
我现在已经搜索了将近半天...但我无法找到为什么chrome6/7似乎是唯一一个与IE8/FF3.6/Opera相比没有添加填充到指定宽度的浏览器表格单元格.
当然,如果您正在使用表格布局,这一点至关重要:固定,因为突然间他们必须注意指定的px宽度.
最后我的问题是:有没有人知道为什么Chrome的计算方式不同,哪个浏览器是正确的(符合标准),希望有一个优雅的解决方案？
目前,我唯一的解决方案是使用chrome.css进行条件注释,我手动将填充添加到宽度...颤抖......
(顺便说一句:任何想要告诉px宽度不合适的webdeveloping的人......随意离开这个页面)
此外:(相对于该回信)
首先感谢您立即回信......我试图让它尽可能短,并在那里我减少的事实,以最小......但是,正如你所提到的,webdeveloping中有很多varibales,所以我试着澄清......
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4 /strict.dtd">
<html>
<head>
<style type="text/css">
div { width:300px; }
table { table-layout:fixed; width:100%; height:50px; }
td.col1 { width:20px; background-color:blue; }
td.col2 { width:40px; background-color:red; }
td.col3 { width:60px; background-color:yellow; }
td.col3 { width:auto; background-color:yellow; }
td { padding:5px; }
</style>
</head>
<body>
<div>
<table cellpadding="0" cellspacing="0">
<tr>
<td class="col1"></td>
<td class="col2"></td>
<td class="col3"></td>
<td class="col4"></td>
</tr>
</table>
</div>
</body>
现在如果你切换css线
td { padding:5px; }
在不同的浏览器中,您会看到chrome在宽度范围内包含填充,而其他浏览器则添加填充
希望这有助于澄清并提前感谢
berny
我尝试重现您的问题，但在 Chrome 7 和 Firefox 3.6 中，以下内容对我来说看起来完全相同：
<!DOCTYPE html>
<style>
table { table-layout: fixed; border: 1px solid black; }
td { width: 5px; background: green; outline: 1px solid red; padding: 5px; }
</style>
<table>
<tr><td></td><td></td></tr>
</table>
为了解决您的问题，我建议您首先尝试添加文档类型（如果您还没有文档类型）。使用文档类型将触发标准模式，这意味着浏览器之间的行为更有可能保持一致。我上面使用的<!DOCTYPE html>是 HTML5 文档类型，但它实际上可以在几乎所有浏览器中触发标准模式。
如果标准模式不能帮助您获得更好的一致性，那么请尝试将您的问题减少到一个最小的示例；去掉所有无关的东西，直到你只剩下足够的东西来看到你的问题。我上面给出的例子表明了我的意思是多么简单；只需足够的标记和样式即可轻松查看表格并在浏览器之间进行比较。一旦你减少到一个最小的例子，你可能会自己看到问题，或者如果没有，你将有一些东西可以发布在像StackOverflow这样的论坛上并获得更有用的答案，因为人们不必猜测什么你的问题是，或者费力地浏览整个页面的 HTML 和 CSS 只是为了找到你提到的一个小问题。
| 归档时间： |
|
| 查看次数： |
13487 次 |
| 最近记录： |