具有左CSS浮動形式的麻煩和右

我有我的CSS的麻煩。我想要在左上方同時顯示下拉菜單，並且想要在右側顯示文本輸入，但我該怎麼做？

下面是html代碼：

<div class='lt-container'> 
<form id='moduleForm'> 
<select name="module" id="modulesDrop"> 
<option value="">Please Select Module</option> 
    </select> 
    </form> 
</div> 




<div class='lt-container' > 
<form id='moduleExistForm'> 
<select name="module" id="modulesDrop"> 
<option value="">Please Select Course</option> 
    </select> </form> 
</div> 


<div id='rt-container' > 
<form id='detailsForm'> 


    <table> 
    <tr> 
    <th></th> 
    <td><input type='hidden' id='idmodule' name='moduleid' value='' /> </td> 
    </tr> 
    <tr> 
    <th>Module ID:</th> 
    <td><input type='text' id='nomodule' name='moduleno' readonly='readonly' value='' /> </td> 
    </tr> 
    <tr> 
    <th>Module Name:</th> 
    <td><input type='text' id='namemodule' name='modulename' readonly='readonly' value='' /> </td> 
    </tr> 
    <tr> 
    <th>Credits:</th> 
    <td><input type='text' id='credits' name='creditsname' readonly='readonly' value=''/> </td> 
    </tr> 
    </table> 
    <div id='moduleAlert'></div> 

    </form> 



    </div>

CSS：

.lt-container, #rt-container { 
float: left; 
} 

#rt-container { 
clear: right; 
margin-left: 5%;  
}

來源

2012-12-07 user1881090

http://jsfiddle.net/C95uc/4/

<div class='lt-container'> 
<form id='moduleForm'> 
<select name="module" id="modulesDrop"> 
<option value="">Please Select Module</option> 
    </select> 
    </form> 

<form id='moduleExistForm'> 
<select name="module" id="modulesDrop"> 
<option value="">Please Select Course</option> 
    </select> </form> 
</div>

兩個<select>走在同<div class='lt-container'>

來源

2012-12-07 18:40:40

這兩個下拉列表不會堆疊在彼此之上，因爲您已將兩個下拉列表分配給了一個「float：left」屬性，這使得它們並排排列。相反，將它們包裝在一個div中並使該div浮動。

<div class="lfloat"> 
    <!-- Both Dropdowns --> 
</div>

CSS：

.lfloat { 
float:left; 
}

一定要添加一個「浮動：權利」屬性，使其不會出現以下兩個下拉列表的形式。

例如：http://jsfiddle.net/C95uc/5/

來源

2012-12-07 18:42:13 eziegl

具有左CSS浮動形式的麻煩和右

回答

相關問題