0

いくつかの div/UL を表示するパネルバーがあります。たとえば、リストの幅が 40% に設定されていると、パネルバーが必要以上に下にスライドし、「あるべき」場所にジャンプして戻ります。UL の 40% を削除すると、すべてが期待どおりに機能します。

バージョン 2015.3.930 にはこの問題がありますが、古いバージョン (ランダムに選択された 2011.3.1407) にはありません。

<ul class="doctypecontainer noselect">
    <li style="clear:both;">
        <span>Truck Freight Bill (1)</span>

        <div class="doctypecontainercontent">
            <div class="docdatelabel"><input type="checkbox" />10/27/2015</div>
            <ul class="pagelist">
                <li><input type="checkbox" /><span>Page 1</span></li>
                <li><input type="checkbox" /><span>Page 2</span></li>
                <li><input type="checkbox" /><span>Page 3</span></li>
            </ul>
            <ul class="pagelist">
                <li><input type="checkbox" /><span>Page 4</span></li>
                <li><input type="checkbox" /><span>Page 5</span></li>
                <li><input type="checkbox" /><span>Page 6</span></li>
            </ul>

            <div class="docdatelabel"><input type="checkbox" />11/15/2015</div>
            <ul class="pagelist">
                <li><input type="checkbox" /><span>Page 1</span></li>
                <li><input type="checkbox" /><span>Page 2</span></li>
                <li><input type="checkbox" /><span>Page 3</span></li>
            </ul>

            <div class="docdatelabel"><input type="checkbox" />11/21/2015</div>
            <ul class="pagelist">
                <li><input type="checkbox" /><span>Page 1</span></li>
                <li><input type="checkbox" /><span>Page 2</span></li>
                <li><input type="checkbox" /><span>Page 3</span></li>
            </ul>

            <span style="clear:left; display:block;"></span>
        </div>

    </li>
</ul>

ここでフィドルを参照してください：http://jsfiddle.net/u48kLrem/

ページリスト クラスから width:40% を削除すると、期待どおりにスライドします。

4

1 に答える 1

0

わかりません、男。テキストの折り返し（または何かの折り返し）に関係していて、高さを誤って計算していると思われます。おそらく彼らの側のコーディングが悪いだけですが、単純な変更によりジャンプが消えます。また、この変更により、信頼性と将来性も向上するはずです。

.pagelist {
    padding-bottom:5px;
    list-style-type:none;
    padding-left:10px;
    width: 50%; /* change this to 50% */
    float: left;
    box-sizing: border-box; /* add this to force it to calculate
                               the padding in with the width to
                               total 50% */
}

デモ: http://jsfiddle.net/jmarikle/2ekxpuu6/

于 2015-11-12T20:57:51.993 に答える