2012-01-26 11 views
1

を表に入力フォームのいくつかの単純化されたコードである:CSSを使用して最も広い子要素の幅にコンテナ要素を強制する方法はありますか?ここ

<html> 
<body> 
    <div class='container' style='width: 950px; margin-left: auto; margin-right: auto'> 
     <form> 
      <table> 
       <colgroup> 
        <col width='175' /> 
        <col width='200' /> 
        <col width='200' /> 
       </colgroup> 
       <tr> 
        <td>Input Field 1</td> 
        <td>Input Field 2</td> 
        <td>Input Field 3</td> 
       </tr> 
      </table>   
      <div class='buttons-small' style='float: right';> 
       <button class='submit'>Update</button> 
       <button class='cancel'>Cancel</button> 
      </div> 
      <div style='clear: both'></div> 
     </form> 
    </div> 
</body> 
</html> 

私はたい何が上記の表の右端に位置合わせするボタン小DIVのためのものです。フォームにwidthプロパティを設定することができます(この場合は575pxになります)が、テーブルを作成するPHPによって選択された列に応じて幅が変わります。したがって、フォームの幅は動的である必要があります。おそらく右の浮動ボタンがそれを強制しているので、おそらくコンテナの幅を継承しています。

CSSを使用して、フォームがその内部の表の幅であることを確認するにはどうすればよいですか?私が今までに見つけた唯一の手段は、それを左に浮かべることですが、右の要素が必要ないので、これは不必要なようです。

ありがとうございます!

答えて

1

ディスプレイを追加:インラインブロック。あなたのフォームには、テーブルの周りにコンテナを縮小包装します。

+0

IE7のサポートが必要な場合は、次のURLを参照してください。http://blog.mozilla.com/webdev/2009/02/20/cross-browser-inline-block/ – shaunsantacruz

関連する問題