0

http://jsfiddle.net/RRkC7/をご覧ください。

囲んでいる DIV タグ「c」の幅を子テーブル t1 の幅に正確に設定しました。ただし、水平スクロール バーがあるため、垂直スクロール バーが表示されます。理想的には、「c」の幅は「t1」とまったく同じであるため、横スクロールは表示されません。

そして、これを回避する方法についてのアイデア。

何もハードコーディングできないことに注意してください。コンテンツが追加されると内側の TABLE の幅が広がる可能性があり、その場合はコンテナーの div タグのサイズを変更します。

また、テーブルの幅が特定の数を超えた場合に、水平スクロール バーと垂直スクロール バーの両方が表示されるようにしたいと考えています。

ありがとう、アルン

<div id="p" style="overflow:hidden">
    <div id="c" style="overflow:auto">
        <table id="t1">
            <tr><td>testing_testing_testing</td><td>testing_testing_testing</td></tr>
            <tr><td>testing_testing_testing</td><td>testing_testing_testing</td></tr>
            <tr><td>testing_testing_testing</td><td>testing_testing_testing</td></tr>
            <tr><td>testing_testing_testing</td><td>testing_testing_testing</td></tr>
            <tr><td>testing_testing_testing</td><td>testing_testing_testing</td></tr>
            <tr><td>testing_testing_testing</td><td>testing_testing_testing</td></tr>
            <tr><td>testing_testing_testing</td><td>testing_testing_testing</td></tr>
            <tr><td>testing_testing_testing</td><td>testing_testing_testing</td></tr>
            <tr><td>testing_testing_testing</td><td>testing_testing_testing</td></tr>
        </table>
    </div> </div>
4

3 に答える 3

0

幅に固定量を加算または減算することではありませんpadding: 5pxが、div の幅をパディングの 2 倍に増やす CSS に気付いた場合は、画像に表示されます。したがって、この場合は 10px の正確な量のパディングを追加する必要があります。padding-leftpadding-right

次のように幅とパディングを計算できます

$(function(){
    var toBeWidth = $("#t1").width() + (parseInt($("#t1").css("padding-left").split("px")[0])*2)
    $("#c").width(toBeWidth);
    $("#c").height(150);
});
于 2013-02-12T04:50:56.713 に答える
0

c div の幅を指定し、テーブルの幅を定義しないでください。その場合、テーブルは c div の幅を継承します。テーブルのオーバーフロー プロパティを試してみましょう。そのため、テーブルがより多くのデータを取得し、その幅が c div で定義されている幅よりも大きくなる場合にのみ、スクロールバーが表示されるようになりました。

    overflow:scroll;
于 2013-02-12T02:02:20.700 に答える
0

パディングのせいかもしれませんが、わかりませんが、JavaScriptを変更するとうまくいきました。

$(function(){
    $("#c").width($("#t1").width() + 20);
    $("#c").height(150);
})

http://jsfiddle.net/RRkC7/1/

テーブル内の要素をいじってみたところ、幅がうまく変わりました

于 2013-02-12T02:06:05.827 に答える