html - 如何在文本对齐 :left? 时将 tbody 居中放置在表格中

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>

检查这张图片:

如何在保持 text-align: left 的同时使表格主体或表格列在表格中居中。

Answer 1

如果我的理解正确，您正在寻找类似的东西。还去清理了你的语法，这在很多方面都是无效的，但希望这能有所帮助，干杯。

#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>