首页 > 解决方案 > 将 TD Align="center" 转换为 CSS

问题描述

我正在更新旧代码。该代码在表格单元格中绘制了一个图表,作为气象站输出的一部分。

有效的代码是:

<td style="width:33.33%; background-color:#FFFFFF" align="center">
<div id="windchill">small</div>
</td>

JavaScript 插入图形,结果对象居中。

我尝试了很多事情,但我认为正确的方法应该是:

<td style="width:33.33%; background-color:#EFEFEF;text-align:center;">
<div id="outsidetemp">small</div>
</td>

JavaScript 插入图形并将生成的对象拉到左侧。

我尝试在我的 CSS 中创建一个类,text-align:center;并将该类用于 TD 和 DIV(以及两者),但该对象始终保持在左侧。

CSS中的表格和单元格定义是:

table {
    font-family: Geneva, Arial, Helvetica, sans-serif;
    width: 100%;
    border: 0;
    border-collapse: collapse;
    float: left;
/*    table-layout: fixed; */
/*    word-break: break-all;*/ /* debug */
}

td {
    white-space:normal;
//    text-align: left;
    vertical-align: top;
    font-size: 100%;
    padding-top: 0.2em;
    padding-right: 0.5em;
    padding-bottom: 0.2em;
    padding-left: 0.5em;
    color: #222222;
}

TR 或 DIV 没有任何内容。

我可以让它工作的唯一方法是align="center"在 TD 标签上使用不推荐使用的标签。我真的很想让页面没有错误。请问有什么想法吗?

标签: htmlcsshtml-tablealignment

解决方案


值得深入研究填充单元格的 JavaScript。结果中嵌入了一个 POSTION:RELATIVE CSS 语句。我只是在我的 shell HTML 中用 POSTION:STATIC 覆盖了它,一切都正常工作——在 TD 行中没有 ALIGN 语句。

感谢您的想法,以及深入挖掘的鼓励。我正在撕掉我剩下的小头发!

问候约翰


推荐阅读