3

編集2：

問題は、ルールの「bigTable」要素にあるようです。どうやらこれはlayout-templateで使用されたときに間違ったmin-widthを継承していました。私はまだこれを調査しています。

それでも、divをもう一度試してみます。大きな問題の1つは、固定ナビゲーションと動的コンテンツの使用でしたが、私はすでにこのための聖杯ソリューションを見つけました（http://alistapart.com/article/holygrail）。

提案とすべての素敵なトロロロロをありがとう。

編集：

この問題をhttp://jsbin.com/eyitij/4/editに複製しました

テーブル+td幅に奇妙な問題があります。私はこれに似たコードを持っています：

<table class="mainLayout" style="width: 100%;">
    <tr>
        <td style="width: 250px;">
            <div id="leftNavigationPanel"> * content * </div>
        </td>
        <td id="panelCell">
            <div class="panel">
                 <table id="bigTable" width="100%"> * LOTS OF CONTENT, includes big table * </table>
            </div>
        </td>
    <tr>
</table>

このコードをブラウザで実行すると、mainLayoutがオーバーフローするため、3600pxになります。これは、Panel内の大きなテーブルが原因で発生します。

私が参照している大きなテーブルは、画面内に含めることができます。そうすると、水平スクロールバーが表示されます（これが私が欲しいものです）。これは、big-tableがルール「width：100％」で別のhtmlファイルにロードされている場合に機能します。

mainLayoutにルール「display：block;」を追加した後、mainLayoutテーブルは〜1800pxにレンダリングされ、画面内に含まれますが、問題は「panelCell」-TDの幅が〜3400pxのままであるため、ページ全体をスクロールし続けていることです。 .TDはテーブルに含まれていませんが、常に250px + bigTable.width（）に展開されます！？

基本的に、ブラウザは「panelCell」を計算して、window.width--leftNavigationPanelのみを埋める方法を知りません。

javascript +「panelCell」の事前計算された最大幅ルールを使用せずに正しいルールを作成する方法はありますか？

  • panelCellはウィンドウ内に含まれている必要があります
  • bigTableは、スクロールバーを使用してpanelCell内に含まれている必要があります
4

1 に答える 1