Jquery CSS Left和Top在chrome、firefox和IE中的行为不同

所以我有一个包含两个单元格的表格，我想把一个元素放在一个单元格的中心。它在Chrome中正常工作，但在IE或Firefox中却无法正常工作。知道为什么会这样吗？我如何让它跨浏览器工作

在Firefox中，left属性似乎不是right，它不是定位到父块，而是定位到整个文档。在IE中，top属性不起作用

我们即将发布！！！！
#分割元素{
位置：绝对位置；
最高：50%；
左：50%；
利润上限：-50px；
左边距：-50px；
宽度：100px；
高度：100px；
背景颜色：蓝色；
}
.分区{
位置：相对位置；
背景颜色：黄色；
}

更新：

我不使用“垂直对齐：中心”的原因是因为我真正想做的不是将其放置在中心

所以我把一个元素放在中心，想把两个元素以固定的偏移量放在中心元素旁边，每边一个。我希望偏移量是固定的，即使窗口大小改变。（表格将占窗口的100%，每个td占50%，因此当窗口大小改变时，td大小也会改变）

我想到的方法是使用绝对定位，首先将两个元素放置在中心，然后使用边距将它们按中心元素的[width/2+fixOffset]推

也许有更好的办法

请参见问题：

基本上这是因为

position:relative

在表单元格元素（

td

或任何

display:table cell

）上具有未定义的行为，这意味着每次浏览都会按需实现它，没有规则

因此，在某些情况下，它可能会起作用（参见chrome），但在其他情况下则不起作用

我自己解决了同样的问题。最后使用div，因为我确实需要相对于容器定位的子元素，在容器之外

如果您只需要将内容居中，请使用

垂直对齐：中间

而不是

位置：绝对

-

顶部：50%

-

页边顶部：-somepx

组合

请参见编辑的

为什么，哦，为什么要使用绝对定位

您已经在一个表格单元格中，

text align

和

vertical align

非常适合将内联内容居中：

.div{
    background-color: yellow;
    text-align:center;
    vertical-align:middle;
}

#divElement{
    display:inline-block;
    width: 100px;
    height: 100px;
    background-color: blue;
}

---

快速正确的回答！甚至在我能标记它之前。我将需要把类不TD，但添加一个div-wrap我猜你的意思是垂直对齐：中间；请看我下面的评论，我实际上不只是想把它放在中心。@Matyas“未定义”行为不是td元素的属性，而是所有表单元格元素（包括应用了

display:table cell

的元素）。我真正想做的是不把它放在中心。所以我把一个元素放在中心，想把两个元素放在固定距离的中心元素旁边。我希望这个距离是固定的，即使窗口大小改变。所以我想到的方法是先把这两个元素放在中心，然后用边距把它们按中心元素的宽度/2推，也许有更好的方法吗？可能是

.div{
    background-color: yellow;
    text-align:center;
    vertical-align:middle;
}

#divElement{
    display:inline-block;
    width: 100px;
    height: 100px;
    background-color: blue;
}