0

要素が少ないdivがあり、div内のラベルとテキストボックスが適切に配置されていません。スクリーンショットが表示されます。これらの正式な名前と会社名とテキストボックスを配置するアイデアがあるため、すべてのテキストボックスは同じポイントから開始する必要があります。

ありがとう

ここに画像の説明を入力してください

4

4 に答える 4

1

ラベルと入力を設定widthします。

.the-label {
    width: 160px;
}

.the-input {
    width: 220px;
}
于 2012-09-10T11:33:41.657 に答える
0

テーブルを使用するか、テーブルのように見えるが trs/tds の代わりにスパン/div を使用する十分なマークアップを使用するか、どちらが悪いか自問する必要があります。この場合、テーブルは問題ないと思います (リレーショナル データベースを扱ったことがある場合、2 列しかないテーブルがたくさんあることは珍しくありません)。

すでに提案されているように、ラベル要素に幅を使用するか、わずかに害の少ない CSS テーブルを使用できます。

div.pseudo-row { display: table-row }
/* input might need to go in a container and have the container set to table-cell instead */
div.pseudo-row label, div.pseudo-row input { display: table-cell }

<div class="pseudo-row">
<label for="first-item">First item</label>
<input type="text" id="first-item" />
</div>

<div class="pseudo-row">
<label for="second-item">Second item</label>
<input type="text" id="second-item" />
</div>

http://www.vanseodesign.com/css/tables/

念のため、この例ではテーブルのみを使用し、CSS テーブルの表示プロパティは別の日に取っておきます。

于 2012-09-10T12:14:17.850 に答える
0

これを行う方法の 1 つを次に示します。

http://jsfiddle.net/FmKfP/

于 2012-09-10T11:34:15.110 に答える
0

非表示のテーブルを使用してそれらを整列させることができます。

<table border="0">
<tr><td>Legal Name:</td><td><input type="text"></td></tr>
<tr><td>Business Name:</td><td><input type="text"></td></tr>
</table>
于 2012-09-10T11:34:24.937 に答える