Как исправить проблему выравнивания постов в этой теме WordPress

Question

Я использую w3school w3css для этого сайта, и я использовал w3-col l6 m6 s12 для отображения сообщений.Это просто означает, что на большом экране будет отображаться 2 столбца рядом, то же самое для среднего экрана и только один, покрывающий все 12 столбцов на небольших экранах.

Но сообщения не выравниваются должным образом.

Я попытался добавить свойство высоты как авто, но оно не работает.

Проверьте этот демонстрационный сайт, который я загрузил на свойвеб-сайт, чтобы вы могли увидеть его в действии.

http://wordpress.takshaksh.xyz/wp/

Answer 1

Пожалуйста, добавьте ниже код в style.css

div.w3-row-padding {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

или добавьте новый класс в w3-row-padding наподобие col_wrap и примените стиль ниже

.col_wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.col_wrap:after,
.col_wrap:before { display:none;}

Answer 2

Вы можете добавить этот CSS ваш родительский контейнер на w3-col l6 m6 s12

.w3-row-padding{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
 }

Answer 3

Вы можете исправить это, имея только 2 элемента на <div class="w3-row-padding w3-row">.