1

フロート (行ごとに 3 つ) を使用してフォト ギャラリー グリッド レイアウトを作成しようとしています。この動作を修正しますか?

<!doctype html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <style>
.wrap{
    width:900px;
    background:red;
    margin:0 auto;
    overflow:hidden;
}

.wrap div{
    float:left;
    width:295px;
    height:200px;
    background:#333;
    margin-bottom:5px;
    margin-right:0.469em;
    overflow:hidden;
}

.wrap div:nth-child(3n+3){ /* wont work in IE8 */
    margin-right:0;
}

.clear:before, .clear:after{ content:""; display:table; }
.clear:after{ clear:both; }
        </style>
    </head>
    <body>
        <div class="wrap clear">
            <div>&nbsp;</div>
            <div>&nbsp;</div>
            <div style="margin-right:0;">&nbsp;</div>
            <div>&nbsp;</div>
            <div>&nbsp;</div>
            <div style="margin-right:0;">&nbsp;</div>
            <div>&nbsp;</div>
            <div>&nbsp;</div>
            <div style="margin-right:0;">&nbsp;</div>
        </div>​
    </body>
</html>
4

1 に答える 1

0

Chrome の最新バージョン (現在 23.0.1271.64 m - Windows) では発生しません。丸めバグである可能性があります。

于 2012-11-22T09:06:34.467 に答える