メインカラムの記事が中央寄せにならない

タイル2列は、headタグの中のstyle.cssで幅やらが設定されて(書き出されて)います。

親テーマcss-custom.phpの中に、

<?php if ( is_list_style_tile_thumb_2columns_style() ): ?>
#main .entry{
  width:327px;
}

こういう部分がありますが、ここで幅を変えることはできます。ここで変えたら、それ以降の必要な部分も変更しないといけません。

しかしながら親テーマをいじるとアップデートでカスタマイズがなくなるので、デベロッパーツールでセレクタを調べながら、子テーマstyle.cssに、

#main .entry {
  width: 380px !important;
}

.entry-thumb img{
  width: 380px !important;
}

などと書きます。

#mainが840pxでも左右のpaddingがあるので実質780pxしか使えませんから、上記がギリかと。

!importantがついていないセレクタは後から読み込まれても!important付きを上書きすることはできません。!importantがついてるセレクタは、プロパティを上書きする際に!importantを付けないと上書きできません。

タイル2列の場合、head内のstyleタグにcssが書き出されるわけですが、これには!importantがついてないので、それよりも前に読み込まれる子テーマstyle.cssでサイズを上書きできるということになります。

これらcssの優先順位によってどのスタイルが適用されるかが決まります。一番良いのは、!importantを付けずにスタイルすることですが、タイル2列がカスタマイザーでの設定のためここはやむを得ない状態です。

本来はカスタマイザーから設定せず、masonry(タイル2列にしているスクリプト)の設定を子テーマjavascript.jsに書き、サイズを同style.cssに書けば済むことですが、カスタマイザーで設定を変えるとここらの本来やらないといけない設定を自動化する必要があるので現状はこういう仕様になっています。

まぁ方法的には他の方法もあるんですけどね。
例えばカスタマイザーで2列を選んだら、bodyタグに.tile-2などと入れるようにして、

.tile-2 #list .entry {
  width: xxx;
}

とすれば親テーマでスタイルできるため、子テーマで変更もできるようになります。なのでスタイルタグでhead内に書き出さなければならない理由というのは特に無いとは思うんですが、基本デフォルトの状態でカスタマイザーを利用してリストを色々変更するというのが主な使い方ですから、デフォルトを変更した場合はやはりそれに合うようにカスタマイズするしかありません。

どうすればできるか、何を触ればできるかがわかれば、単に面倒なだけで特別難しいわけではないではないので、上記を参考にいじってみて下さい。

Hidekichi 様。
ありがとうございました！
すごく詳細な説明でよくわかりました。
記載の通りにやってみたら、中央寄せになりました。
本当に助かりました。
再度、ありがとうございました。