HTML: Table design not working properly - html

Question

I am trying to achieve the below format design in HTML. I tried using multiple TR inside TD but i was not successful in getting the below design.
Please find the below code i have been trying:
#content {
position: absolute;
top: 110px;
left: 350px;
width: 775px;
height: 605px;
}
#content label {
display: block;
float: left;
margin-right: 4px;
vertical-align: top;
}
<div id="content">
<label>
Date Range
</label>
<label>
(Past)
<br />
<input id="myDatePast" type="text" style="width:31px;" />
</label>
<label>
(Future)
<br />
<input id="myDateFuture" type="text" style="width:31px;" />
</label>
<label>
<br />Total
<input id="myDateFuture" type="text" style="width:31px;" />Days
</label>
</div>

Answer 1

Well you can try something like this. I used table and css to style them.
table {
border: 1px solid #666;
border-collapse: collapse;
}
th,tr {width: 150px;}
th input {width: 50px;}
.th1-main {
border-right: 1px solid #666;
}
.th1-modify {margin-left: 60px;}
.th1-modify2 {margin-right: 60px;}
<div id="content">
<table>
<tr>
<th class="th1-main">
<span class="th1-modify">Date</span> <br>
<span class="th1-modify2">Range</span>
</th>
<th>
Past<br>
<input type="text" value="60"><br>
Date
</th>
<th>
Future<br>
<input type="text" value="360"><br>
Date
</th>
<th>
Total - <input type="text" value="420"> days
</th>
</tr>
</table>
</div>
Hope this was helpful.

Answer 2

table,#cell1{
border:2px solid gray;
border-collapse: collapse;
}
#total{
width:auto;height:50px;
}
#cell1{
width:100px;
height:75px;
}
td:not(.empty){
width:100px;
height:50px;
}
<div id="content">
<table>
<tr>
<td id="cell1">
<span style="float:right"><b>Date</b></span><br/><br/>
<span style="float:left"><b>Range</b></span> </td>
<td class="empty"></td>
<td>
(Past)
<br/>
<input id="myDatePast" type="text" value="60" style="width:31px;" /><br/><b>Date</b>
</td>
<td>
(Future)<br/>
<input id="myDateFuture" type="text" value="360" style="width:31px;" /><br/><b>Date</b>
</td>
<td id="total">
Total-
<input id="myDateFuture" type="text" value="420" style="width:31px;"/><b> Days</b>
</td>
</table>
</div>

Answer 3

A good setup would be
<table>
<tr>
<td>2</td><td>2</td>
</tr>
<tr>
<td>3</td><td>4</td>
</tr>
<tr>
<td>5</td><td>6</td>
</tr>
</table>