テーマSydneyのLATEST NEWSの表示が崩れるのを回避させる

テーマSydneyのLATEST NEWS(最新ニュース一覧)、初期状態の1行3記事表示の場合は問題がないのですが、カスタマイズして6記事2段表示などにした場合、アイキャッチ画像の大きさ、タイトルの長さなどにより、以下のように表示が崩れます。

テーマSydneyのLATEST NEWSの表示が崩れるのを回避させる

 

それを避けるために、アイキャッチ画像のサイズを揃えたり、タイトルの高さを揃えたりしたものの、アイキャッチのリサイズで微妙に高さが異なっても崩れたりしました。

よくよく考えたら、1記事のボックスのクラスblog-postの高さを揃えればいいのかもしれないと思い、追加CSSに以下を追加しました。

.blog-post {
    height: 26em;
}

ブラウザのデベロッパツールを見ながら高さを上記の通りに調整したところ、とりあえず揃いました。

テーマSydneyのLATEST NEWSの表示が揃った状態

スマホ縦表示だと大丈夫ですが、スマホ横表示だとちょっと問題がありますが、ひとまずこのままとしておきます。

参考:sydneyの最新ニュースを表示するウィジェットがうまく作動しません、助けて下さい!