2

[ここ][1] の HTML フォームがあります。ラベルの表示を toinlineとwidthtoに設定200pxしていますが、幅がありません。それを取るためにどのように幅を与えることができますか?

これが私のフォームです

<form>
<div>
    <label>Name</label>
    <input type="text" />
    <label>Organization</label>
    <input type="text" />
</div>
<div>
    <label>E-mail</label>
    <input type="text" />
    <label>Phone</label>
    <input type="text" />
</div>
</form>

そしてCSS：

label {
    display: inline;
    width: 200px;
}
4

5 に答える 5

5

要素widthに を与えることはできません。インラインにして幅を持たせたい場合inlineは、に設定する必要があります。displayinline-block

CSS を次のように変更する

label {
    display: inline-block;
    width: 200px;
}

それを機能させます。

ライブデモ: http://dabblet.com/gist/3149758

于 2012-07-20T08:55:46.920 に答える
2

width プロパティは、インラインの置換されていない要素には適用されません。

ディスプレイをインラインに設定しないでください。代わりにインラインブロックが好きかもしれません。

于 2012-07-20T08:55:59.663 に答える
1

インライン プロパティは幅を読み取りません。幅を読み取るには、display: block;またはを使用する必要があります。display: inline-block;

于 2012-07-20T08:56:40.620 に答える
0

これを使用してください。

label {

    width: 200px ;
    display:inline;
    float:left;
}
​input[type="text"]{
    float:left;
}​
于 2012-07-20T09:00:01.887 に答える
0

とにかく、ラベルはすでにインライン要素であるため、スタイルを に設定する必要はありませんdisplay:inline;。

幅を追加したい場合は、最初に要素をブロック要素にします。display:inline-blockこれは、またはを使用して行うことができますdisplay:block; & float:left;

フィドルのデモ: http://jsfiddle.net/surendraVsingh/eZH5C/1/

于 2012-07-20T09:01:07.117 に答える