Что нужно сделать, чтобы контент одного блока не влиял на высоту других блоков?

Question

html{
  box-sizing: border-box;

}

*, *::before, *::after{
  box-sizing: inherit;
}


/*работа с элементом коллекции*/
.block_img img{
  width: 75px;
  height: 75px;
  
}

.elem{
  display: flex;
  margin: 0 15px;
  width: 200px;
  border: 1px solid;
  word-break: break-all;
}

.container{
  display: flex;
  justify-content: center;
  margin: 0 auto;
}

.row{
  display: flex;
  margin: 10px -15px;
  
}

<!DOCTYPE HTML>
<html>
 <head>
  <meta charset="utf-8">    
  <link rel="stylesheet" href="css/style.css">
 </head>
 <body>
   <div class="main">
    <div class="container">

      <div class="container_1">

        <div class="row">
          <div class="elem">
            <div class="block_img">
              <img src="old_to_new_logo_transform.jpg" alt="">
              <h2>Заголовок 1</h2>
              <ol>
                <li>ли 1</li>
                <li>ли 2</li>
                <li>ли 2</li>
                <li>ли 2</li>
                <li>ли 2</li>
              </ol>
            </div>
            <div class="block_text">
              <h2>Заголовок 2</h2>
              <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit.</p>
            </div>
          </div>
  
           <div class="elem">
            <div class="block_img">
              <img src="old_to_new_logo_transform.jpg" alt="">
              <h2>Заголовок 1</h2>
              <ol>
                <li>ли 1</li>
                <li>ли 2</li>
              </ol>
            </div>
            <div class="block_text">
              <h2>Заголовок 2</h2>
              <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit.</p>
            </div>
          </div>
  
           <div class="elem">
            <div class="block_img">
              <img src="old_to_new_logo_transform.jpg" alt="">
              <h2>Заголовок 1</h2>
              <ol>
                <li>ли 1</li>
                <li>ли 2</li>
              </ol>
            </div>
            <div class="block_text">
              <h2>Заголовок 2</h2>
              <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit.</p>
            </div>
          </div> 
        </div>
      </div>
     </div>   
    </div>
 </body>
</html>

Answer 1

добавьте это:

.row {
  align-items: flex-start;
}

БЛОГ НА HUSL

Что нужно сделать, чтобы контент одного блока не влиял на высоту других блоков?

Ответы (1 шт):