Как выровнять <td>с из одной таблицы против другой?

Question

Я новичок в HTML / CSS, и мне трудно выровнять дни открытия, часы, дни закрытия магазина Chicken и Open, Hours и Close из таблицы. Я хочу, чтобы дни и время выравнивались прямо под каждой категорией. Например, открыто (вс / пн.), Часы (9-3 вечера), закрыто (вт / пт). Ниже приведены мои коды, любые советы будут с благодарностью! Спасибо !!!

<table id="shops">
        <tr>
            <th>Shops</th>
            <th>Location</th>
            <th>Store Hours</th>
            <th>Products</th>
        </tr> <!-- Nested table for store hours and product types-->
        <tr>
            <td colspan="2"></td>
            <td>
                <table id="hours_table">    
                    <tr>
                        <th>OPEN</th>
                        <th>HOURS</th>
                        <th>CLOSE</th>
                    </tr>
                </table>
            </td>
            <td> 
                <table id="products_table">    
                    <tr>
                        <th>Animals</th>
                        <th>Cost</th>
                        <th>Items</th>
                        <th>Cost</th>
                    </tr>
                </table>
            </td>
        </tr>


        <tr>
            <td id="chicken_shop">Cuckoo House Chicken Shop</td>
            <td>West Natura</td>
            <td>
                <table id="chicken_hours"> 
                    <tr>
                        <td>SUN/MON/WED/THURS/SAT</td>
                        <td>9AM - 3PM</td>
                        <td>TUES/FRI</td>
                    </tr>
                </table>
            </td>
</table>

Answer 1

Привет, вот решение:

<table id="shops" border='1'>
  <tr>
    <th>Shops</th>
    <th>Location</th>
    <th>Store Hours</th>
    <th colspan="4">Products</th>
  </tr> <!-- Nested table for store hours and product types-->
  <tr>
    <td id="chicken_shop">Cuckoo House Chicken Shop</td>
    <td>West Natura</td>
    <td>
      <table width="333" id="hours_table" border='1'>
        <tr>
          <td>OPEN</td>
          <td>HOURS</td>
          <td>CLOSE</td>
        </tr>
        <tr>
          <td>SUN/MON/WED/THURS/SAT</td>
          <td>9AM - 3PM</td>
          <td>TUES/FRI</td>
        </tr>
      </table>
    </td>
    <th>Animals</th>
    <th>Cost</th>
    <th>Items</th>
    <th>Cost</th>
  </tr>
</table>

Answer 2

Вместо использования <th> вы должны использовать <td>, даже если он является частью заголовка таблицы.

  <table>
    <thead>
       <tr>
          <td>Shops</td>
          <td>SOmethng</td>
          <td>Something#2</td>
       </tr>
   </thead>
   <tbody>
       <tr>
          <td>Something in the body of the table</td>
          <td>something</td>
           <tdSomething</td>
       </tr>
   </tbody>
  </table>

Я предлагаю использовать w3schools.com для дополнительной информации. Также вы можете добавить границыесли вы хотите, чтобы вокруг него были какие-то границы.