Как сохранить заголовок тега <h3> в заголовке css?

Question

У меня есть следующие HTML коды с CSS для отображения 3 столбцов одинаковой ширины. Но при отображении <h3> темы не отображаются в одинаковых позициях. Как я могу отображать их с одинаковыми позициями?

* {
  box-sizing: border-box;
}


/* Create three equal columns that floats next to each other */

.column {
  float: left;
  width: 33.33%;
  padding: 10px;
  height: 100px;
}

.column2 {
  float: left;
  width: 33.33%;
  padding: auto;
  height: 800px;
}


/* Clear floats after the columns */

.row:after {
  content: "";
  display: table;
  clear: both;
}

<div class="row">
  <div class="column" style="background-color:#ddd;">
    <h2>Size & Weight</h2>

  </div>
  <div class="column" style="background-color:#ddd;">
    <h3>Weight </h3>
    <p>Approx. 255g</p>
  </div>
  <div class="column" style="background-color:#ccc;">

  </div>
</div>

<div class="row">
  <div class="column2" style="background-color:#ddd;">
    <h2>General Features</h2>
    <!-- <p>Some text..</p> -->
  </div>
  <div class="column2" style="background-color:#ddd;">
    <h3>Volume Control </h3>
    <p>Touch Sensor</p>

    <h3>Impedance (Ohm) </h3>
    <p>47 ohm (1kHz) (when connecting via the headphone cable with the unit turned on) , 16 ohm (1kHz) (when connecting via the headphone cable with the unit turned off)</p>


  </div>
  <div class="column2" style="background-color:#ccc;">
    <h3>Passive Operation</h3>
    <p>Yes</p>

    <h3>Frequency Response (Active Operation)</h3>
    <p>4Hz-40,000Hz</p>
  </div>
</div>

Answer 1

находится в том же положении, но вам нужно нормализовать «высоту» курса. Попробуйте:

h2, h3 {
    line-height: 30px;
}

Answer 2

Я добавил отступ: 10px к ".column2", и все выглядит одинаково,

.column {
  float: left;
  width: 33.33%;
  padding: 10px;
  height: 100px;
}

.column2 {
  float: left;
  width: 33.33%;
  padding: 10px;
  height: 800px;
}


/* Clear floats after the columns */

.row:after {
  content: "";
  display: table;
  clear: both;
}

<div class="row">
  <div class="column" style="background-color:#ddd;">
    <h2>Size & Weight</h2>

  </div>
  <div class="column" style="background-color:#ddd;">
    <h3>Weight </h3>
    <p>Approx. 255g</p>
  </div>
  <div class="column" style="background-color:#ccc;">

  </div>
</div>

<div class="row">
  <div class="column2" style="background-color:#ddd;">
    <h2>General Features</h2>
    <!-- <p>Some text..</p> -->
  </div>
  <div class="column2" style="background-color:#ddd;">
    <h3>Volume Control </h3>
    <p>Touch Sensor</p>

    <h3>Impedance (Ohm) </h3>
    <p>47 ohm (1kHz) (when connecting via the headphone cable with the unit turned on) , 16 ohm (1kHz) (when connecting via the headphone cable with the unit turned off)</p>


  </div>
  <div class="column2" style="background-color:#ccc;">
    <h3>Passive Operation</h3>
    <p>Yes</p>

    <h3>Frequency Response (Active Operation)</h3>
    <p>4Hz-40,000Hz</p>
  </div>
</div>