中心格与最大宽度

我有2个div应用最大宽度代理他们，因为我想。一个最大宽度为900px，而另一个为820px，如果窗口尺寸变小，它们会缩小。中心格与最大宽度

<div id="componentWrapper"> 
    <div class="thumbContainer"></div> 
</div> 

#componentWrapper{ 
    position:absolute; 
    height:190px; 
    width:100%; 
    max-width:500px; 
    top:50%; 
    background:red; 
    margin-top:-85px; 
} 

#componentWrapper .thumbContainer{ 
    top:0px; 
    left:0px; 
    height:180px; 
    max-width:420px; 
    margin-left:40px; 
    margin-right:40px; 
    background:green; 
    overflow:hidden; 
}

http://jsfiddle.net/DzgQ3/1/

我想现在纯CSS如果可能的话这个中心里面的窗口。即使窗口的大小小于外部元素的当前宽度，它也需要保持居中。

来源

2013-02-20 Toniq

似乎按照您为我描述的方式工作，或者我错过了什么？ – byronyasgur 2013-02-20 20:04:50

在FF中似乎没问题。 – 2013-02-20 20:05:15

margin：auto;通常适用于这样的事情。

来源

2013-02-20 20:07:23

布局的工作原理，但我的问题是如何将窗户外的div集中在一起。只有当窗口大小大于外部div时，才能使用边距，一旦窗口大小小于外部div的原始大小，边距不会再使它居中。 – Toniq 2013-02-21 00:49:50

我想我现在看到你在尝试什么，我不认为在使用position：absolute时有什么办法。这是你所需要的？＃组件包装器{float：top; margin：auto; height：190px; 宽度：100％; max-width：500px; 背景：红色; margin-top：30％; } – 2013-02-23 08:47:37

中心格与最大宽度

回答

相关问题