这段代码在 Chrome、Safari 和 IE 中生成了一个垂直背景交替的类似日历的表格，但在 Firefox 8.0.1 下它只是在左上角生成了一个微小的、凌乱的小 Blob (没有尝试过其他版本的FF)。
我曾尝试将“内部”div 改为 span，但这没有区别。 CSS 验证器说一切正常。它只是在 FF 中不起作用，我不知道为什么它不起作用。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<title> Test CSS page </title>
<style type="text/css">
#Row1 {
position:absolute;
vertical-align:top;
top: 2 px;
}
#Row2 {
position:absolute;
vertical-align:top;
top: 102 px;
}
#Row3 {
position:absolute;
vertical-align:top;
top: 202 px;
}
#Row4 {
position:absolute;
vertical-align:top;
top: 302 px;
}
#Row5 {
position:absolute;
vertical-align:top;
top: 402 px;
}
#col1 {
text-align:right;
position:absolute;
height:100 px;
width:79 px;
left:4 px;
}
#col2 {
text-align:right;
position:absolute;
height:100 px;
width:79 px;
left:83 px;
background-color:#bfffbf;
}
#col3 {
text-align:right;
position:absolute;
height:100 px;
width:79 px;
left:162 px;
}
#col4 {
text-align:right;
position:absolute;
height:100 px;
width:79 px;
left:241 px;
background-color:#bfffbf;
}
#col5 {
text-align:right;
position:absolute;
height:100 px;
width:79 px;
left:320 px;
}
#col6 {
text-align:right;
position:absolute;
height:100 px;
width:79 px;
left:399 px;
background-color:#bfffbf;
}
#col7 {
text-align:right;
position:absolute;
height:100 px;
width:79 px;
left:478 px;
}
</style>
</head>
<body>
<div id="Row1">
<Div id="col1">1 </Div>
<Div id="col2">2 </Div>
<Div id="col3">3 </Div>
<Div id="col4">4 </Div>
<Div id="col5">5 </Div>
<Div id="col6">6 </Div>
<Div id="col7">7 </Div>
</div>
<div id="Row2">
<Div id="col1">8 </Div>
<Div id="col2">9 </Div>
<Div id="col3">10 </Div>
<Div id="col4">11 </Div>
<Div id="col5">12 </Div>
<Div id="col6">13 </Div>
<Div id="col7">14 </Div>
</div>
<div id="Row3">
<Div id="col1">15 </Div>
<Div id="col2">16 </Div>
<Div id="col3">17 </Div>
<Div id="col4">18 </Div>
<Div id="col5">19 </Div>
<Div id="col6">20 </Div>
<Div id="col7">21 </Div>
</div>
<div id="Row4">
<Div id="col1">22 </Div>
<Div id="col2">23 </Div>
<Div id="col3">24 </Div>
<Div id="col4">25 </Div>
<Div id="col5">26 </Div>
<Div id="col6">27 </Div>
<Div id="col7">28 </Div>
</div>
<div id="Row5">
<Div id="col1">29 </Div>
<Div id="col2">30 </Div>
<Div id="col3">31 </Div>
<Div id="col4">32 </Div>
<Div id="col5">33 </Div>
<Div id="col6">34 </Div>
<Div id="col7">35 </Div>
</div>
<br></body>
</html>
最佳答案
数字和“px”单位之间不能有空格。替换所有这些 px 位置。例如，“2px”与“2px”。
编辑:另外，您应该考虑修改 ID“col1”-“col7”并将它们设为类。
关于css - 为什么这个 css 定位在 FF8 中不起作用？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/8379745/