получить эффект правильного столбца
я есть такой код:
<div class="article-container">
<div class="article">
<h3>title1</h3>
<p>article1</p>
</div>
<div class="article">
<h3>title2</h3>
<p>article2</p>
</div>
<div class="article">
<h3>title3</h3>
<p>article3</p>
</div>
<div class="article">
<h3>title4</h3>
<p>article4</p>
</div>
</div>
и я хочу преобразовать этот столбец с 1 линией в 2 столбца, как это:
Я уже пытался использовать этот код, но есть ли другой способ разделить div?
.article-container {
display: flex;
flex-wrap: wrap;
}
.article {
flex-grow: 1;
flex-basis: 50%;
}
.article:after {
content: "";
flex: auto;
}
<div class="article-container">
<div class="article">
<h3>title1</h3>
<p>article1</p>
</div>
<div class="article">
<h3>title2</h3>
<p>article2</p>
</div>
<div class="article">
<h3>title3</h3>
<p>article3</p>
</div>
<div class="article">
<h3>title4</h3>
<p>article4</p>
</div>
</div>
Это отличается от этого другого вопросаРазделить деление на 2 столбца с помощью CSSРасположение статьи в этом вопросе отличается. Кто-нибудь получил идею?