css定位BY中心

Question

我有一些父盒子，里面有很多可拖动的孩子，有着已知的x，y坐标。 问题是将孩子定位在其中心，而不是左上角。 儿童拳击大小是自动的。

有没有办法实现这一点，没有javascript位置重新计算父和子的每个调整大小？

P.S。 jquery-ui有插件'position'，当使用like

时，它主要完成所需的操作

child.position({ my: center, at: left top, of: parent, offset: x y})

但该插件以像素为单位计算位置，我更愿意使用％，以便父级调整大小不会涉及重新定位所有子项。

Answer 1

您可以使用死亡中心。

CSS：

#horizon        
{
    color: white;
    background-color: transparent;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 0px;
    width: 100%;
    height: 1px;
    overflow: visible;
    visibility: visible;
    display: block
}

#content    
{
    font-family: Verdana, Geneva, Arial, sans-serif;
    background-color: transparent;
    margin-left: -125px;
    position: absolute;
    top: -35px;
    left: 50%;
    width: 250px;
    height: 70px;
    visibility: visible
}

演示： http://www.wpdfd.com/editorial/thebox/deadcentre4.html