divの幅が機能していませんか？

Question

divのコンテンツに問題があります。たとえば、div内にテーブルを置き、そのdivの幅を(width:200px !important)に設定すると、そのdivを上書きします。だから、どのようにそのdiv内のすべてのコンテンツを保持することは可能ですか？

フィドル例： http://jsfiddle.net/ebG9N/45/

Answer 1

あなたはそのためwhite-space: nowrap;にヘッダを設定し、ブラウザは、ヘッダを破ることができないので、テーブルの幅は、コンテナのdivよりも大きくなります。

オーバーフローする部分を切り取るにはoverflow: hidden;、スクロールバーを作成するにはoverflow: auto;を設定できますが、スクロールバーがないと正しく表示されません。

Answer 2

divのcssにoverflow:auto;を使用してみてください。

Answer 3

あなたが望む任意のサイズのdiv内に何らかの形で収まるとは予想できません。

div.divano{ 
    width:200px !important; 
    border:2px solid yellow; 
    background:#eaeaea; 
    height:200px; 
    overflow: scroll; 
} 

をあなたはまたoveflow: hiddenを使用することができるが、それだけでは見えない部分を隠します：あなたはどうすることができますすることは、使用して、少なくともブラウザが（overflow: scroll）をスクロールできるようにする、です。また、overflow: scrollは、常にスクロールバーを表示します（クリッピングありまたはクリッピングなし）。 overflow: autoを使用して、クリッピングが発生した場合にのみコンテンツをスクロールするように指定できます。

Answer 4

2つの解決策があります。

i）厳密にテーブルWITHIN divを含める場合は、overflow:auto;が最適です。

ii）あなたが気が変わり、テーブルの幅にdivをWRAPしたい場合。 display:table;は行く方法です。

通常、明示的に知られているより幅の狭い要素内に幅の広い要素を含めることは悪い考えです。