HTML - Zwei verschiedene Tabellen nebeneinander setzen

Question

Ich möchte diese beiden Tabellen nebeneinander platziert werden. Ich habe versucht, div, aber nicht in der Lage, sie nebeneinander zu legen. Also habe ich versucht mit style="display: inline-block, aber es funktioniert nicht. Brauche Hilfe dazu.

<form id="checkbox1" method="get" align="left"> 
 
    <table style="width:30%" align="left" style="display: inline-block;"> 
 

 
    <input type="checkbox" value="select" align="center" id="check1"> Calculate The Number of Head Count When Days Are Fixed<br> 
 

 
    <tr> 
 
     <td>Number of Days</td> 
 
     <td class="left"><input type="text" id="numDays" /></td> 
 
    </tr> 
 

 
    <tr> 
 
     <td>Head Count</td> 
 
     <td class="left"><input type="text" name="hc" id="hc" /> Per Shift</td> 
 
    </tr> 
 

 
    </table> 
 
</form> 
 

 

 
<form id="checkbox2" method="get" align="left"> 
 
    <table style="width:30%" align="left" style="display: inline-block;"> 
 

 
    <input type="checkbox" value="select" align="center" id="check2"> Calculate The Number of Days When Head Counts Are Fixed<br> 
 
    <tr> 
 
     <td>Number of Head Count</td> 
 
     <td class="left"><input type="text" id="numHeadC" /></td> 
 
    </tr> 
 

 
    <tr> 
 
     <td>Number of Days</td> 
 
     <td class="left"><input type="text" name="days" id="days" /> Days</td> 
 
    </tr> 
 

 
    </table> 
 
</form>

Answer 1

Die Tische sind nicht Geschwister. Sie müssen die Formen so stylen, dass sie nebeneinander sind.

Setzen Sie display: inline-block auf die Formularelemente.

Sie sollten auch die Fehler beheben, die a validator würde abholen.

Answer 2

form{ 
width: 50%; 
float: left; 
padding: 0 15px; 
}