如何将绝对定位的div保存在可调整大小的可拖动容器div的中心？

<!--container with jQuery UI draggable , resizable plugins applied--> 
<div class="container"> 
    <div class="stayInCenter" style="position:absolute;width:300px; height:400px"> 
     I will aways stay in center of the container no matter where you are 
     and how big or small you become 
    </div> 
</div>

来源

2011-02-10 qinHaiXiang

如果您不需要垂直居中：

.container .stayInCenter {  
    position:relative; /* Not absolute */ 
    margin:0 auto  /* Make the left/right be centered */ 
}

如果您确实需要垂直居中也：

.container .stayInCenter {  
    position:absolute; 

    /* Move to the center of the positioned parent */ 
    left:50%; top:50%; 

    /* Give a fixed size */ 
    width: 300px; height: 400px; 

    /* Move backwards by half the size, so the center is at 50% */ 
    margin-left:-150px; margin-top:-200px; 
}

此外，don't mix CSS with your HTML。

来源

2011-02-10 15:12:41 Phrogz

但是在应用了JQuery UI可拖动插件后，容器的位置将被设置为绝对永远！ – qinHaiXiang 2011-02-10 15:22:19

你把一个固定的宽度，让我们说的“width：500px的”
，你把“保证金：汽车”

如果你需要一个上边距，你写如。 'margin-top：100px''margin：auto'

应该完成这项工作

来源

2011-02-10 15:14:59 Mash

如何将绝对定位的div保存在可调整大小的可拖动容器div的中心？

回答

相关问题