CSS具有自动保证金的固定位置

Question

我想要一个组件来保持页面的水平中心（两列），并且我有一个子组件（右列），我希望其位置固定，因此该子组件的位置必须固定，但是整个两列要居中。

#content {
    width: 1200px;
    height:auto !important;
    height:100%;
    min-height:100%;
    padding-top: 42px;
    padding-bottom: 100px;
    margin-auto: 0 auto;
    position: relative;
}

#left {
    width: 700px;
    float: left;
}

#right {
        width: 500px;
        position: fixed;
        top: 0px;
}

Answer 1

您无法使用来做到这一点margin:auto，但是您可以执行以下操作：

#CSS-SELECTOR-YOU-ARE-USING{
    background:#FF0000; // Just so you can see whats going on
    position:fixed; // Position the element
    right:50%; // Move it to the right for 50% of parent element
    margin-right:-250px; // You need here to put 1/2 of what you have below in width
    width:500px;
}

这样，您可以将元素向右移动50％，然后向后移动其宽度的一半。这样，您将获得居中的元素position:fixed。