我的表格不允許我的複選框並排坐在一起。

我的其餘頁面符合容器寬度，這將等於此midBodyWrapper的頂部和底部線條，但這些框不會並排放置。我不確定發生了什麼，但我也嘗試過一些內聯樣式，但沒有任何效果。請看附圖。感謝您的幫助。我的表格不允許我的複選框並排坐在一起。

<table id="midBodyWrapper" border="0" cellpadding="0" cellspacing="0" width="100%"> 
          <tbody><tr> 
           <td class="subHeader" width="35%"><br>I Mainly Shop For: 
           </td> 
          </tr> 
          <tr> 
           <td class="checks2"> 
            <div> 
     <table cellpadding="0" cellspacing="0"> 
      <tbody><tr valign="middle"> 
       <td></td> 
       <td></td> 
      </tr> 
     </tbody></table> 
     <input type="checkbox" name="CheckBox.A address.Men's Clothing">Men's Clothing<input type="hidden" name="CheckBox.A address.Men's Clothing" value="off"> 
    </div> 

    <div> 
     <table cellpadding="0" cellspacing="0"> 
      <tbody><tr valign="middle"> 
       <td></td> 
       <td></td> 
      </tr> 
     </tbody></table> 
     <input type="checkbox" name="CheckBox.A address.Women's Clothing">Women's Clothing<input type="hidden" name="CheckBox.A address.Women's Clothing" value="off"> 
    </div> 

    <div> 
     <table cellpadding="0" cellspacing="0"> 
      <tbody><tr valign="middle"> 
       <td></td> 
       <td></td> 
      </tr> 
     </tbody></table> 
     <input type="checkbox" name="CheckBox.A address.Boy's Clothing">Boy's Clothing<input type="hidden" name="CheckBox.A address.Boy's Clothing" value="off"> 
    </div> 


           </td> 
          </tr> 
         </tbody></table> 


#midBodyWrapper { 
    border: 1px solid #bbb; 
    border-left: 0; 
    border-right: 0; 
    padding: 30px 0; 
    margin: 40px 0; 
}

這也是一個負責任的網頁，所以我覺得由於某種原因，它停留在它的響應較小壓扁形式。因爲這將是如何看待移動，這種。

來源

2016-02-14 Singleton

嘗試：'顯示：inline-block的;'來你的'td div'元素。 – Chris

工作。謝謝。我有時候很愚蠢......我知道這一點。 – Singleton

爲了幫助清理StackOverflow，請Chris創建一個答案（通知他，輸入'@ Chris'然後輸入您的消息）並接受它。 –

要顯示一行的元素，你需要應用以下屬性：

td div { 
    display: inline-block; 
}

或

td div { 
    float: left; 
}

Demo

來源

2016-02-14 14:04:15 Chris

我的表格不允許我的複選框並排坐在一起。

回答

相關問題