0

12col 1140px のレスポンシブな流動的なフレームワークである cssgrid.net を使用していますが、センタリングに問題があります。

私のウェブサイトには「background-size: cover;」があります。画像と、サイズを変更しているときでも、ブラウザ内で水平方向に中央揃えにしたいロゴがあります。

これは私が持っているHTMLです:

<div class="container">
<div class="row">
    <div class="fourcol"></div>
    <div class="fourcol">
        <div class="logo"></div>
    </div>
    <div class="fourcol last"></div>
</div>

そしてCSS：

.logo {
        background: url(../images/logo_retina.png) no-repeat;
        background-size: 175px 175px;
    }

これは、私のサイトの上部がどのように見えるかです: ここに画像の説明を入力

ロゴは 4 列の 2 番目のセットから始まりますが、サイズを変更しても、4 列のセット内でロゴを中央に配置するにはどうすればよいですか?

コーディングは単なる趣味であることを忘れないでください。

4

1 に答える 1

1

それぞれが同じ固定幅を持っていると仮定すると、それは役立つはずdiv.fourcolだと思いbackground: url(../images/logo_retina.png) no-repeat center middle;ます。幅がautoに設定された状態で互いにフローティングしている場合div.rowは、累積幅の。よりも幅が広い可能性があるため、問題が発生しdiv.fourcolます。

于 2012-11-29T23:33:23.187 に答える