0

私はこの質問への答えを探している年齢を探しました!

作成する新しいWebサイトに12列のレイアウトを使用しています。1行に4つのdivがあります:

<div class="colContainer">
        <div class="row">
            <div class="threecolImg">
                <p>Row 1: three</p>
            </div>
            <div class="threecolImg">
                <p>Row 1: three</p>
            </div>
            <div class="threecolImg">
                <p>Row 1: three</p>
            </div>
            <div class="threecolImg last">
                <p>Row 1: three</p>
            </div>
        </div>
    </div>

そして私のCSSは次のとおりです。

.colContainer {
padding-left: 20px;
padding-right: 20px;
}

.row {
width: 100%;
max-width: 1140px;
min-width: 755px;
margin: 0 auto;
overflow: hidden;
}

.threecolImg {
float: left;
min-height: 1px;
width: 22.05%;
}

現状では、divはすべて互いに隣接していますが(これは良いです!)、中央に配置されていません(これは悪いです!)

誰かが私がそれらを中心に置くのを手伝ってくれるでしょうか?!

どうもありがとう、

ポール

4

1 に答える 1

1

すべてのthreecolImgdivをthreecoldivに置き換えます。そして、それらは中央に配置されます。

<div class="colContainer">
    <div class="row">
        <div class="threecol">
            <p>Row 1: three</p>
        </div>
        <div class="threecol">
            <p>Row 1: three</p>
        </div>
        <div class="threecol">
            <p>Row 1: three</p>
        </div>
        <div class="threecol last">
            <p>Row 1: three</p>
        </div>
    </div>
</div>

また、CSSから削除します。

.threecolImg {
  float: left;
  min-height: 1px;
  width: 22.05%;
}

また、3列のdivで画像のスタイルを設定する場合は、そのセレクターを選択してください。

.threecol img {

}
于 2012-07-07T23:41:14.007 に答える