Как центрировать тело внутри таблицы, имея text-align: left? - PullRequest
0 голосов
/ 03 сентября 2018

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

Проверьте это изображение: http://prntscr.com/kpy2mt

Как можно центрировать тело таблицы или столбцы таблицы внутри таблицы, сохраняя выравнивание текста: слева.

1 Ответ

0 голосов
/ 14 ноября 2018

Если я правильно понимаю, вы ищете что-то вроде этого. Также пошли и очистили ваш синтаксис, который во многих отношениях был недействительным, но надеюсь, это поможет, ура.

#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>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...