0

したがって、次の 2 つの状況があると考えてください。

左の div のテキストが右の div の入力要素よりも長い一般的な状況を次に示します。

ラッパーのサイズを正しい div 要素の長さと同じに指定し、同じシナリオで、最初の jsfiddle の例のように、正しい div 入力要素をラッパーの下部に配置するにはどうすればよいですか?

私が苦労しているのは、右の div に 4 つのテキストのうちの 1 つだけがあり、左の div にボタンだけがある場合の別のシナリオです。

最初のシナリオと同じ CSS スタイルを使用して、ラッパーのサイズを 1 行に変更し、要素をインラインで表示するにはどうすればよいですか?

私はランダムな試みに腹を立てているので、この原因についていくつかの指針を教えてください

  • height: auto;
  • min-height: 50px;

およびオンラインで見つけた他の CSS プロパティ。

それでも、ラッパーの固定サイズを指定せずに正しい入力要素を下に揃える方法がないことに気付きました。divこれに対する回避策はなく、tableタグを回避できますか?

これは、私が話している 2 つのシナリオのオンライン落書きです:

右と左の div 要素のコンテンツは可変であることに注意してください。私がいじった 2 つの例は極端なケースです。

  1. 左の div コンテンツは右の div よりも長く、右の div コンテンツは下に配置されます。

  2. 左と右の div のコンテンツ サイズは同じであるため、ラッパーはコンテンツを 1 行に表示します (左の div テキストと右の div はボタン)。

4

2 に答える 2

1

グラフィックを確認した後、あなたが求めているものに対する CSS の方法はないと思います。偽の列の方法を使用して、適切なコンテンツを固定または完全に下隅に配置することは解決策でしょうか?

http://alistapart.com/article/fauxcolumns

<div style="width:400px;position:relative;">
    <div style="height: 200px; width:250px;">left</div>
    <div style="height: 50px; width:150px;position: absolute;right: 0; bottom: 0;">right</div>
</div>

http://jsfiddle.net/26V6E/

于 2013-10-01T12:47:49.623 に答える
0

高さ: 100% を試しましたか?

于 2013-10-01T12:24:16.127 に答える