HTMLテーブル - td子孫で最大幅が機能しない

width: 100%のテーブルとそのテーブルの要素がwidth: 40em; max-width: 100%ですが、ブラウザウィンドウが小さすぎると要素がまだテーブルを伸ばしています。HTMLテーブル - td子孫で最大幅が機能しない

この要素を固定幅にしたいが、容器が小さすぎる場合は、この要素をコンテナより大きくしないでください。固定幅に十分な余裕がない場合、max-width: 100%は利用可能なスペースに合わせて小さくする必要があります。これはテーブルの外で動作します。

max-widthはテーブル自体にはありません。実際には<input>要素にありますが、リンクしたコードには同じ問題のある別のテーブルが<span>要素に含まれています。テーブルの外部にある<input>フィールドも正しく動作します。

2012-10-19 meustrus

あなたが動作するように<td>の子孫のmax-widthプロパティを取得するには、テーブル要素のためのtable-layout: fixedを使用する必要があります（代わりに％で、割合は液体レイアウトで使用されています）。 MDNから

：

table-layout CSSプロパティはレイアウト表のセル、行、及び列に使用されるアルゴリズムを定義します。

固定値：
表と列の幅は、テーブルとCOL要素の幅により、または細胞の最初の行の幅によって設定されます。の行のセルは列の幅に影響しません。

WORKING DEMO

table { 
    table-layout: fixed; 
}

。

2012-10-19 17:04:35

それは確かに私の例よりも良く見え、それはボックスモデルの倒錯（私が主に問題の一部であるかもしれない場合には補完のために主に含まれていました）をよく示しています。しかし、それは私の問題を解決するものではありません。 – meustrus

これは以前と同じように動作していなかった理由を覚えていません。 – meustrus

あなたが要素の上に置く場合は、要素がmax-width: 100%に伸ばします。あなたが一定の幅をしたい場合は

、width: 40px使用

2012-10-19 16:38:45

...あなたは私の前のコメントナンセンスを完全に解決した答えを変更しました。今では、あなたの両方が「最大幅」や私がやろうとしていることを理解していないように思えます。 – meustrus

よろしいですか？達成したいことは何ですか、固定レイアウトはpxを指定する必要があります。 –

ページレイアウトではありません。ページレイアウト自体は、テーブルの幅を流体（100％）にすることができます。テーブル内の要素は入力フィールドで、その幅で表示する必要がありますが、余裕がない場合は、使用可能なスペースに合わせて縮小する必要があります。 – meustrus

答えて