我想要一个组件来保持页面的水平中心(两列),并且我有一个子组件(右列),我希望其位置固定,因此该子组件的位置必须固定,但是整个两列要居中。
#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; }
您无法使用来做到这一点margin:auto,但是您可以执行以下操作:
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。
position:fixed