วิธีจัด div 2 ตัวให้เรียงแนวนอนใน HTML

เพื่อจัด div 2 ตัวให้เรียงแนวนอนใน HTML ใช้คุณสมบัติ CSS float กับค่า left สามารถลองรันโค้ดด้านล่างเพื่อเรียนรู้วิธีจัด div แบบแนวนอน:

ตัวอย่าง

<!DOCTYPE html> 
<html> 
<head> 
<style> 
.demo div { 
  float: left; 
  clear: none; 
} 
</style> 
</head> 
<body> 
<div class="demo"> 
  <div> 
    <span>div1</span> 
    <select size="5"> 
      <option value="c1">India</option> 
      <option value="c2">US</option> 
      <option value="c3">UK</option> 
      <option value="c4">Australia</option> 
    </select> 
  </div> 
  <div> 
    <span>div2</span> 
    <select size="5"> 
      <option value="r1">1</option> 
      <option value="r2">2</option> 
      <option value="r3">3</option> 
      <option value="r4">4</option> 
    </select> 
  </div> 
</div> 
</body> 
</html>