3

以下のコードでは、スパンがテキスト ボックスの右側に表示されているので、テキスト ボックスの下に表示します。何ができるか教えてください。

<fieldset class="no_border">
    <div class="float_left">
        <label>Age in years:</label>
        <br />
        <input readonly="readonly" type="text" class="effect" id="nominee_one_years" name="nominee_one_years" value="0" style="width:20%" /><span id="info_nominee_one_years">x</span>
    </div>
    <div class="float_left">
        <label>Relationship:</label>
        <br />
        <input type="text" class="effect" name="nominee_one_relationship" id="nominee_one_relationship" style="width:95%" /><span id="info_nominee_one_relationship">x</span>
    </div>
    <div class="float_left">
        <label>Relationship:</label>
        <br />
        <input type="text" class="effect" name="nominee_one_relationship" id="nominee_one_relationship" style="width:95%" /><span id="info_nominee_one_relationship">x</span>
    </div>



#nominee_details span {
     margin-left: 0px;
     color: #b1b1b1;
     font-size: 11px;
     font-style: italic;
     display:none;
 }
 fieldset.no_border {
     overflow:hidden;
     border:0;
     padding:0 0 10px 0;
     margin:0;
 }
 .float_left {
     float:left;
     width:33%;
 }

DIV のない他のスパン

<fieldset class="no_border">

        <label>Age in years:</label>
        <br />
        <input readonly="readonly" type="text" class="effect" id="nominee_one_years" name="nominee_one_years" value="0" style="width:20%" /><span id="info_nominee_one_years">x</span>
</fieldset >

JSフィドル

私は実際に2つの状況を持っています

上記のようにフィールドセットとdivの内側にある1つ目と、フィールドセットの内側にある2つ目

最初のケースのスパンがテキスト ボックスの下にレンダリングされない 2 番目のスパンが正しく表示される

私のjsfiddleを見れば、私が説明しようとしていることを理解できるでしょう

4

2 に答える 2

0

spandivはインライン要素です。または またはまたは のようなブロック レベル要素をスパンにp設定するか、スパンの直前にdisplay:blocka を配置することができます。<br/>

于 2013-08-01T11:50:55.013 に答える