css - Unable to align HTML tables parallel to each other -
i have created 2 html grid tables finding difficulty while placing/aligning them parallel each other.
i using align = right table getting aligned downwards(one below other) , not shifting right in parallel order . can suggest making mistake in below code , how can rectify it?
p.s: below code issue can checked copying , saving in notepad test.txt , renaming test.html , open in ie or firefox browser.
<table id="ss" class="easyui-datagrid" style="width:380px;height:auto;"> <thead> <tr><th field="name2" width="80">status</th></tr> </thead> <tbody> <tr> <td>india</td></tr> <tr><td>canada</td></tr> <tr><td>usa</td></tr> <tr><td>uk</td></tr> </tbody> </table> <table id="vv" class="easyui-datagrid" style="width:380px;height:auto;" align = "right"> <thead> <tr><th field="name3" width="80">status</th></tr> </thead> <tbody> <tr><td>india</td></tr> <tr><td>china</td></tr> <tr><td>oz</td></tr> <tr><td>uk</td></tr> </tbody> </table>
here solution:
<div style="float:left;"><table id="ss" class="easyui-datagrid" style="width:380px;height:auto;"> <thead> <tr><th field="name2" width="80">status</th></tr> </thead> <tbody> <tr> <td>india</td></tr> <tr><td>canada</td></tr> <tr><td>usa</td></tr> <tr><td>uk</td></tr> </tbody> </table> </div> <div style="float:left;"><table id="vv" class="easyui-datagrid" style="width:380px;height:auto;"> <thead> <tr><th field="name3" width="80">status</th></tr> </thead> <tbody> <tr><td>india</td></tr> <tr><td>china</td></tr> <tr><td>oz</td></tr> <tr><td>uk</td></tr> </tbody> </table> </div>
Comments
Post a Comment