CSS div內聯

Question

我目前正在建立一個聯繫表單。代碼：

<div id="contact_form"> 
      <form action="contact.php" method="post"> 

       <div class="contact_fields"> 
        <div class="cf1">NAME</div> 
        <div class="cf2"> 
         <input type="text" name="name" /> 
        </div> 
       </div> 

       <div class="contact_fields">  
        <div class="cf1">EMAIL</div> 
        <div class="cf2"> 
         <input type="text" name="name" /> 
        </div> 
       </div> 

       <div class="contact_fields">  
        <div class="cf1">PHONE</div> 
        <div class="cf2"> 
         <input type="text" name="name" /> 
        </div> 
       </div> 

      </form> 
     </div> 

和CSS：

#contact_form 
{ 
    padding:12px 20px 10px 20px; 
    background:#f5f5f5; 
    overflow:hidden; 
    width:700px; 
} 

.contact_fields 
{ 
    width:580px; 
    margin-top:20px;  
} 

.cf1 
{ 
    width:80px; 
    float:left; 
    color:#333333; 
    font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif; 
    font-size:14px; 
} 
.cf2 
{ 
    width:280px; 
    float:left; 

} 
.cf2 input 
{ 
    height:25px; 
    width:280px; 
} 

不過的div contact_fields用休息來內聯，而不是DIV（見我重視的形象。）請給我一個解決方案

Answer 1

擺脫你float: left;

Demo

.cf2 { 
    width:280px; 
    float:left; <----Here 
} 

Answer 2

現在定義你的父母.contact_fieldsoverflow:hidden;

像部分地解決了這個

.contact_fields 
{ 
overflow:hidden;  
} 

Demo