1

デモhttp://jsfiddle.net/W86yx/

.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>
4

1 に答える 1

1

喜んでお手伝いします:)

.main {
    background-color:green;
    width: 400px;
    margin: 0 auto;
}
.center {
    text-align:center;
    background-color:pink
}
.tblInsideHere > div{
    display:inline-block;
}
于 2013-09-13T04:56:23.263 に答える