-1

3つの列を持つテーブルを作成したいと思います。左右の固定幅の列（position：fixed --divsによって隠されています）と中央の可変幅の列です。

これは動作しません：

<table>
    <tr>
        <td width=202px></td>
        <td> [MYCONTENT] </td>
        <td width=200px></td>
    </tr>
</table>

問題は、何らかの理由でブラウザ（ChromeとFirefoxでテスト済み）が、ブラウザウィンドウの幅が十分でない場合は、実際には意味がないと考えていることです。外側の列がトリミングされ、幅の設定が無視されるため、実際のコンテンツが私のdivの下にスライドし、完全にアクセスできなくなります。

私が残した唯一のアイデアは、200ピクセル幅にサイズ変更された1990年代の透明なピクセルを使用することですが、私はその考えに震えます。確かにもっと良い方法があるに違いありませんか？

（ところで、はい、私はさまざまな純粋なcssレイアウトを試しましたが、どれも適切ではありませんでした。たとえば、中央の列にoverflow：autoを使用すると、下部のスクロールバーもスクロールします（!!）。ウィンドウよりも広い場合は、最初に下にスクロールしてスクロールバーを表示し、次に水平方向にスクロールしてから、もう一度上にスクロールして最初に見たいものを表示する必要があります。また、パディングを使用して、必要なマージンを強制しました。左右にありますが、ブラウザウィンドウの幅が十分でない場合も無視されます。）

4

2 に答える 2

1

表は表形式のデータ用です。コンテンツをレイアウトする場合は、CSSを使用する必要があります。

CSSで苦労している場合は、TwitterBoostrapのようなものを使用することをお勧めします。

特定のソリューションが本当に必要な場合は、 「css 3カラムレイアウト流体センター-私はそれであなたを悩ませているわけではありません。あなたがまさに望んでいるものである素晴らしい答えが本当にあり、たくさんあります」のような用語の結果を見てください。検索結果からそれらのページに移動します（特にmanisheriar.comとA List Apartの記事）。

min-width（中央のdiv）とmax-width（およびメディアクエリ）を使用して、小さなウィンドウで何が起こるかを制御できます。

于 2012-08-20T15:39:27.013 に答える
1

わかりました-ここにテーブルがあります。

http://jsfiddle.net/sheriffderek/wAGKp/2/

簡単な答えは-だと思います

  • HTMLからスタイルを取り出し、セレクターを使用します。（この場合はクラス」、次にmin-width---およびwidth..。
  • また、パディングとマージンによってコンテンツの幅が変わることを覚えておいてください...ボーダーボックス方式を使用できます...（それはradです）そして2番目に含まれています...パディングが留まるようにします元のdivサイズ---これがお役に立てば幸いです。

そしてここでそれは私がそれをする方法です。（テーブルなし...）

http://jsfiddle.net/sheriffderek/GBtdy/1/

于 2012-08-20T17:46:14.043 に答える