having trouble with css floating forms left and right

un234567

New Member
I have a jsfiddle below:http://jsfiddle.net/C95uc/3/I am having trouble with my css. I want to display both drop down menus on the left above one another and I want to display the text inputs on the right hand side, but how can I do this?Below is the html code:\[code\]<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>\[/code\]CSS:\[code\].lt-container, #rt-container { float: left; }#rt-container { clear: right; margin-left: 5%; }\[/code\]
 
Back
Top