为表格单元格内的 div 指定的
Float:right 在 IE 中似乎没有效果。我还尝试过 text-align right，除其他外，将图层内容右对齐，但在 IE 7 中没有成功。
CSS 片段:
.workloadcell {
background-color: #E6D7E9;
padding: 0px;
width: 14px;
height: 16px;
text-align: right;
}
div.workload {
background-color: #E6D7E9;
text-align: right;
width: 14px;
float: right;
}
HTML 片段:
<td class="workloadcell">
<div class="workload">
1
</div>
</td>
HTML 和 CSS 均通过验证，并且在 Firefox 中文本正确对齐，正如它应该的那样。如果您想通过复制/粘贴来测试完整代码，请在此处:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1">
<title>Table Test</title>
<style type="text/css">
td {
border: 1px solid black;
}
.workloadcell {
background-color: #E6D7E9;
padding: 0px;
width: 14px;
height: 16px;
text-align: right;
}
div.workload {
background-color: #E6D7E9;
text-align: right;
width: 14px;
float: right;
}
</style>
</head>
<body>
<table>
<tr>
<td>
</td>
<td colspan="4">
<div>
2008
</div>
</td>
</tr>
<tr>
<td>
</td>
<td>
<div>
Q1
</div>
</td>
<td>
<div>
Q2
</div>
</td>
<td>
<div>
Q3
</div>
</td>
<td>
<div>
Q4
</div>
</td>
</tr>
<tr>
<td>
workload forecast
</td>
<td class="workloadcell">
<div class="workload">
1
</div>
</td>
<td class="workloadcell">
<div class="workload">
2
</div>
</td>
<td class="workloadcell">
<div class="workload">
2
</div>
</td>
<td class="workloadcell">
<div class="workload">
2
</div>
</td>
</tr>
<tr>
<td>
actual workload
</td>
<td class="workloadcell">
<div class="workload">
3
</div>
</td>
<td class="workloadcell">
<div class="workload">
3
</div>
</td>
<td class="workloadcell">
<div class="workload">
2
</div>
</td>
<td class="workloadcell">
<div class="workload">
3
</div>
</td>
</tr>
</table>
</body>
</html>
(我知道 CSS 不是最优的，因为类声明对几个元素重复，但如果它与问题无关，请不要对此发表评论。)
最佳答案
它应该按照您的方式工作(或 alexmeia 建议的方式)。
但是，(这是 IE)，标题 Q1、Q2 等将表格列推得比您请求的 14 像素更宽。
列在您定义的 14px 范围内右对齐，但 IE 中的 div 没有向右移动。 (div 保持在为其定义的 14px 内，即使该列实际上宽于 14px)
为了说明这一点，您可以将宽度设置为 28 像素或更改其中一个背景的颜色以展示 in 中的 td 和 div 之间的差异。
.workloadcell {
background-color: #E6D7E9;
padding: 0px;
width: 14px;
height: 16px;
text-align: right;
}
div.workload {
background-color: #E6EEE9;
text-align: right;
width: 14px;
float: right;
}
IE 的解决方案是不定义宽度或使其足够宽以容纳标题。
关于html - 如何在 IE 7 的表格单元格内的 div 中右对齐工作？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/673917/