如何使用 CSS 类在 td 元素内对齐 div

Posted 2023-03-05

【中文标题】如何使用 CSS 类在 td 元素内对齐 div

【英文标题】：How to align a div inside td element using CSS class

【发布时间】：2011-10-27 03:38:53

【问题描述】：

它正在以这种方式工作

<td align="center">

但我想使用 CSS 类。

我这样定义类但没有运气

td

    vertical-align: middle;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    align: center;

垂直对齐有效，文本对齐适用于文本。但它不会以这种方式对齐 td 内的 div 。我想在 td 中对齐 div。

【问题讨论】：

您的脚本应该可以工作。必须有其他 css 样式覆盖您的 td 样式。

不，你不对。您的 td 中有一个块元素，您需要自行设置样式。

这里有一个解决方案 => ***.com/a/57590933/2736742

【参考方案1】：

div  margin: auto; 

这将使您的 div 居中。

Div 本身就是一个块元素。因此，您需要将样式定义为 div 的行为方式。

【参考方案2】：

如果没有问题的一小部分（可能会减少），我无法为您提供太多帮助。如果问题是我认为的那样，那是因为 div 默认占用 100% 宽度，因此无法对齐。

您可能需要将 div 内的内联元素（例如文本）与 text-align:center; 对齐，否则您可以考虑将 div 设置为 display:inline -block;

如果您确实采用了 inline-block 路线，那么您可能不得不考虑我最喜欢的 IE hack。

width:100px;
display:inline-block;
zoom:1; //IE only
*display:inline; //IE only

快乐编码:)

【讨论】：

divs 有背景图片。所以他们的大小正在改变。如果他们采用 100% 的宽度，我不会问它如何对齐 :)