複数のdivを中心に

Question

私はそれらの中に3つのdivを持つ2つの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

余白：0自動;幅：1210ピクセル。

また、あなたがより効率的にするためにCSSクラスを使用する必要がありタイプミス「麦粒腫」:)

Answer 2

を持っています。 id="left"という2つのdivもあります。要素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> 

またスタイルにあなたが正しかったmargin: auto;