css - 将元素定位在中心

Question

我想设置一个元素，其位置在中心是绝对的，这意味着如果元素的位置不是绝对的，那么我们可以这样做：

            margin : 0 auto;

但是我们如何才能对绝对位置的元素做同样的事情呢？

Answer 1

.target {
    position: absolute;
    left: 50%;   /* set left */
    width: 500px;  /* give width */
    margin-left: -250px; /* margin-left = width/2  */
}

并将其父级设置为position: relative

演示

一个示例 jQuery 方法：

var width = $('.target').width();
$('.target').css({
    left: '50%',
    'margin-left': -(width / 2)
});

演示