Как разместить текст рядом, если есть две колонки с картинками?

Question

(то, как все должно выглядеть или что-то близко похожее и все на одном уровне.) https://prnt.sc/10c7nh3

.S2{
        color: gray;
        font-family: calibri;
        padding-top: 20px;
        padding-left: 20px;
        padding-right: 20px;
        flex-wrap: wrap;
        max-width: 50%;
        }
<body>
<div class="S2">
<img style="border: 3px solid white;" src="images/1.jpg" width="250" height="220">
<img style="border: 3px solid white;" src="images/2.jpg" width="250" height="220">
<img style="border: 3px solid white;" src="images/3.jpg" width="250" height="220">
<img style="border: 3px solid white;" src="images/4.jpg" width="250" height="220">
</div>
</body>

Answer 1

css

.wrapper {
        display:flex;
        justify-content:space-around;
        align-items:center;  
        padding: 20px;     
        }

.S2 {
        color: gray;
        font-family: calibri;            
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        width:100%
        }
        
.text {
        text-align:center;
        width:100%;
}

html

<body>
  <div class="wrapper">
    <div class="S2">
      <img style="border: 3px solid white;" src="images/1.jpg" width="250" height="220">
      <img style="border: 3px solid white;" src="images/2.jpg" width="250" height="220">
      <img style="border: 3px solid white;" src="images/3.jpg" width="250" height="220">
      <img style="border: 3px solid white;" src="images/4.jpg" width="250" height="220">
    </div>
    <div class="text">
      <h2>Заголовок</h2>
      <p>Текст</p>
      <p>Текст</p>
      <p>Текст</p>
    </div>
  </div>
</body>

БЛОГ НА HUSL

Как разместить текст рядом, если есть две колонки с картинками?

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