.center の 300px を取り除きたいです。main の下にある 3 つの div/p をすべて中央に配置します。幅を固定せずにそれを行うにはどうすればよいですか? .tblInsideHere の上の div/p をもっと中央に配置したいと思います。幅が同じ (同じテキスト) であるため、div/p は整列する必要があります。次に、tblInsideHere は、前の div/p の左側から開始し、右側で終了する必要があります。これを中心にするにはどうすればよいですか?
CSS:
.main {
background-color:green;
width: 400px;
margin: 0 auto;
}
.center {
margin: 0 auto;
width: 300px;
background-color:pink
}
.tblInsideHere > div {
float: left;
}
html:
<div class="main">
<div class="center">
blah
<span> blah text</span>
<span> blah text</span>
</div>
<p class="center">
blah
<span> blah text</span>
<span> blah text</span>
</p>
<div class="tblInsideHere center">
<div>blah text blah text</div>
<div>blah text blah text</div>
</div>
</div>