1

修正済み / 解決済み

@Steveのおかげで、これが解決策です：

これは、個々のボックスの高さがわずかに異なるためだと思います。それらはすべてフローティングされているため、最初のボックスをわずかに高くすると、最初のボックスが占有する余分なスペースの後に 2 行目の最初のボックスが開始されます。

それらがすべて正確に同じ高さになるように強制されていることを確認してください。

質問

なぜこれが起こっているのかわかりません - 突然、私が開発しているサイトにこれらの奇妙なスペースが現れ始めましたか? (赤いボックスが s に追加されました

なぜこれが起こるのか、またはそれを修正する方法はありますか? この1か所だけではなく、ランダムに空白を追加する別のページを作成していますか?

画像のプロパティを変更すると、max-widthピクセルが 1 つおきにずれて元の場所に戻りますか?

で見ています

クローム/ファイアフォックス/サファリ:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_3) AppleWebKit/537.31 (KHTML, like Gecko) Chrome/26.0.1410.43 Safari/537.31

奇妙な出来事

HTML

<div class="container">
<div class="span12" style="margin-top: -15px; margin-bottom: 10px;">
    <div class="span10" style="margin: 0px auto; float: none;">
        <a href="/news-and-media"><img src="" alt="Magazines and blogs" class="span3 front-page-tile pull-left"></a>
        <a href="/how-to-use"><img src="" alt="How to use" class="span3 front-page-tile pull-left"></a>
        <a href="/store"><img src="" alt="Products" class="span3 front-page-tile pull-left"></a>
        <a href="/endorsements"><img src="" alt="Endorsements" class="span3 front-page-tile pull-left"></a>
        <a href="/before-after"><img src="" alt="Before and After" class="span3 front-page-tile pull-left"></a>
        <a href="/doctor-recommended"><img src="" alt="Doctor Recomended" class="span3 front-page-tile pull-left"></a>
        <div class="clearfix"></div>
    </div>
</div>
<div class="clearfix"></div>
</div>
4

3 に答える 3

0

現在あなたの CSS を見ることができないので、これは推測にすぎませんが、リンクにdisplay:inline-block;( zoom:1;*display:inline;- 古いバージョンの IE の場合は修正) を使用してみましたか?

于 2013-04-04T19:54:56.443 に答える