多divs居中

Question

我有2个divs里面有3个div，所有2个围绕一个大div。我尝试和集中它，它不工作。这里是我的代码：

<div stye="margin-left:auto; margin-right:auto; width: 1210px;"> 
<div id="left" style=" float:left; width: 606px; height: 506px;"> 

    <div style="top:0px; float:left; width:300px; border: 2px solid #FF0; height:502px; text-align:center; font-family: Myriad Pro, Arial, sans-serif; color:#FFF;"><h1>A picture of a cool guy wearing our shirt will go in here.</h1></div> 

    <div style="top:0px; float:left; width:300px; border: 2px solid #FF0; border-left:0px; height:200px; text-align:center; font-family: Myriad Pro, Arial, sans-serif; color:#FFF;"><h1>A product image will go in here.</h1></div> 

    <div style="top:0px; float:left; width:300px; border: 2px solid #FF0;border-top:0px; border-left:0px; height:300px; text-align:center; font-family: Myriad Pro, Arial, sans-serif; color:#FFF;"><h1>A tight product image will go in here.</h1></div> 

</div> 
<div id="left" style="float:left; width: 604px; height: 506px;"> 

    <div style="top:0px; float:right; width:300px; border: 2px solid #FF0; border-left:0px; height:502px; text-align:center; font-family: Myriad Pro, Arial, sans-serif; color:#FFF;"><h1>A picture of a cool guy wearing our shirt will go in here.</h1></div> 

    <div style="top:0px; float:left; width:300px; border: 2px solid #FF0; border-left:0px; height:200px; text-align:center; font-family: Myriad Pro, Arial, sans-serif; color:#FFF;"><h1>A product image will go in here.</h1></div> 

    <div style="top:0px; float:left; width:300px; border: 2px solid #FF0;border-top:0px; border-left:0px; height:300px; text-align:center; font-family: Myriad Pro, Arial, sans-serif; color:#FFF;"><h1>A tight product image will go in here.</h1></div> 

</div> 
</div> 

Answer 1

margin：0 auto;宽度：1210px;

你也有一个错字“麦粒肿” :)

Answer 2

您应该使用CSS类更有效率。你也有两个div id="left"。元素ID是独特的，所以你应该使用类。

<style type="text/css"> 
.myclass { 
    top:0px; float:left; width:300px; border: 2px solid #FF0; height:502px; text-align:center; font-family: Myriad Pro, Arial, sans-serif; color:#FFF; 
} 
</style> 
<!-- this div gets all style from .myclass definition --> 
<div class="myclass">content</div> 

而且居中的div，新增的风格，你是对的margin: auto;