1

サイトを静的な html、css で作成しましたが、正常に動作しています。Ie7、firefox、chromeでテストしましたが、同様に問題ありません。

テキストが他の div と重なることがあります。これが何を作るのかわかりません。リフレッシュすればうまくいきますが、時々起こります

ここに画像の説明を入力

これは Chrome のバグですか、それともコードで何か間違ったことをしていますか。ただのhtmlファイルなので、たまに見つけてびっくりしました。

これがコードです

<div class="slider-wrapper theme-default">
                        <div id="slider" class="nivoSlider">
                            <img alt="" data-thumb="img/ban1.png" src="img/ban1.png" />
                            <a href="http://dev7studios.com">
                                <img alt="" data-thumb="img/ban1.png" src="img/ban1.png" /></a>
                            <img alt="" data-thumb="img/ban1.png" src="img/ban1.png" />
                            <img alt="" data-thumb="img/ban1.png" src="img/ban1.png" />
                        </div>
                        <div id="htmlcaption" class="nivo-html-caption">
                        </div>
                    </div>
                    <div class="news-wrap">
                        <strong>Latest News: </strong>06/01/10 | A guide to maximizing your investment
                    </div>
                    <div class="vert-list">
                        <ul>
                            <li>
                            <div class="left-part">
                                <div class="head-txt">
                                    <img src="img/li1-h.png" alt=""/>
                                </div>
                                <div class="txt">
                                error sit voluptatem accusantium doloremque laudantium,
                                </div>
                                <div class="lm">
                                <img src="img/lm1.png" alt=""/>
                                </div>
                            </div>
                            <div class="right-part">
                                <img src="img/li-i1.png" alt=""/>
                            </div>
                            </li>
                            <li class="mid">
                            <div class="left-part">
                                <div class="head-txt">
                                    <img src="img/li2-h.png" alt=""/>
                                </div>
                                <div class="txt">
                                error sit voluptatem accusantium doloremque laudantium,
                                </div>
                                <div class="lm">
                                <img src="img/lm2.png" alt=""/>
                                </div>
                            </div>
                            <div class="right-part">
                                <img src="img/li-i2.png" alt=""/>
                            </div>
                            </li>
                            <li>
                            <div class="left-part">
                                <div class="head-txt">
                                    <img src="img/li3-h.png" alt=""/>
                                </div>
                                <div class="txt">
                                error sit voluptatem accusantium doloremque laudantium,
                                </div>
                                <div class="lm">
                                <img src="img/lm3.png" alt=""/>
                                </div>
                            </div>
                            <div class="right-part">
                                <img src="img/li-i3.png" alt=""/>
                            </div>
                            </li>
                        </ul>
                    </div>

ここにスタイルがあります

 .slider-wrapper {
        float: left;
        margin-top: -2px;
        position: relative;
    }

        .news-wrap {
            background: url('img/news.png') no-repeat;
            height: 22px;
            width: 100%;
            margin-top: 330px;
            padding-left: 19px;
            padding-top: 8px;
        }

        .news-wrap strong {
            font-weight: bold;
        }

        .vert-list {
            margin-top: 12px;
        }
4

1 に答える 1

1

floatではなく、スタイル ルールの問題のように思えますline-height。要素にフローティング要素のみが含まれる場合、その要素の高さは 0 であり、周囲への影響はなく、そのすべてのコンテンツはそれに続く要素の「上」に浮かびます。

使用しているコードまたはそのスニペットを提供していただけると助かります。

于 2012-07-20T04:30:39.460 に答える