How to center tbody within a table while having text-align:left? - html

Question

#present-container{
background-color: antiquewhite;
text-align: center;
}
#presentation{
display: inline-block;
text-align: center;
}
#tabela{
display: inline-block;
width: 40%;
margin: 10px;
padding: 25px;
border: 2px solid #e4d8ba;
border-radius: 8px;
border-collapse: collapse;
}
#tabela tbody {
}
#tabela th, td {
padding: 15px;
text-align: left;
border-top: 2px solid #e4d8ba;
}
.top{
border: none;
}
<div id="present-containter">
<div id="presentation">
<table id="tabela">
<tr><td class="top">Nearby</td><td class="top"><li>Beach: 500 meters (Pebble)</li><li>Restaurant: 1 km</li><li>Market: 200 meters</li></td></tr>
<tr><td>Included in price</td><td><li>Bedlinen including towels</li><li>Final Cleaning</li><li>Consumption costs</li></td></tr>
<tr><td>other</td><td><li>free WiFi</li><li>pets not allowed</li></td></tr>
</table>
</div>
</div>
Check this image:
How can I center the table body or table columns within the table while keeping text-align: left.

Answer 1

If I'm understanding correctly you're looking for something like this. Also went and cleaned up your syntax which wasn't valid in many ways but hope this helps, cheers.
#present-container {
border: 2px solid #e4d8ba;
border-radius: 8px;
background-color: antiquewhite;
margin: 0 auto;
}
#tabela {
padding: 25px;
border-collapse: collapse;
margin: 10px auto;
}
#tabela tr:not(:last-child) {
border-bottom: 2px solid #e4d8ba;
}
#tabela td {
padding: 15px;
}
<div id="present-container">
<table id="tabela">
<tbody>
<tr>
<td>
Nearby
</td>
<td>
<ul>
<li>Beach: 500 meters (Pebble)</li>
<li>Restaurant: 1 km</li>
<li>Market: 200 meters</li>
</ul>
</td>
</tr>
<tr>
<td>
Included in price
</td>
<td>
<ul>
<li>Bedlinen including towels</li>
<li>Final Cleaning</li>
<li>Consumption costs</li>
</ul>
</td>
</tr>
<tr>
<td>
other
</td>
<td>
<ul>
<li>free WiFi</li>
<li>pets not allowed</li>
</ul>
</td>
</tr>
</tbody>
</table>
</div>