2

ラベル コンテナーと値コンテナーを 1 行に含むフォームがあり、説明するためにフィドルを作成しました: http://jsfiddle.net/eEvEN/3/

レイアウトは固定されており、値コンテナーがラベル コンテナーの下に折り返されることはありません。両方のコンテナーがに設定されているため、リスト行に対してinline-block実行できwhite-space:nowrap(フィドルを参照)、目標は部分的に達成されています。部分的には、ブラウザが 1 行にテキストを保持するのに十分な幅がない場合、値コンテナでテキストを折り返す必要があるためです。だから私white-space:normalは値のコンテナにできると思ったが、うまくいかない...そしてそれはnowrap流行のままだ。

この作業をうまく行うにはどうすればよいですか?

4

1 に答える 1

1

CSS テーブル表示 (つまり、 table-rowおよびtable-cell ) を使用して解決しました。しかし、このソリューションは古い IE バージョンでは正しく動作しません。

li {
    display: table-row;
}
.field_label {
    display: table-cell;
    min-width: 140px;
    background: yellow;
}
.field_widget {
    display: table-cell;
    background: cyan;
}

CSS テーブルを使用したソリューションhttp://jsfiddle.net/ECssv/

HTML テーブルhttp://jsfiddle.net/VrHMm/を使用したソリューションは、古い IE で動作するはずです

于 2013-05-02T15:02:25.347 に答える