記事間の余白設定

>デベロッパーツールなどで該当部分のcssを操作しているのですが、
>どうも適用されないみたいです。

うちのデベロッパーツールでは操作できるんですけれども、うーむ。
もしかすると、css/css-custom.cssが無いとかですかね？
このcssファイルは今まで見たことなかったので、カスタマイザー→その他→カスタマイザーのスタイルを外部CSSに書き出すから書き出されているものかも知れません。

#mainのpaddingを20pxあたりにすれば、.entryのマージンは10pxぐらいとれるかと思います。

#main {
  padding: 20px;
}

#main .entry {
  margin: 10px;　/*お好みで*/
}

あ、スマホでは確認してないので、何かしらあった場合は、メディアクエリ等でマージンの修正はしてください。

Hidekichiさん

早速のご回答ありがとうございます。
少し説明が不足しておりました。

#mainのpaddingは

#main {
background-color:F1F1F1;
border:none;
padding: 0;
}

こちらを、子テーマのstyle.cssに指定しております。
すると左と上の余白が狭まったのですが、
先程の投稿のように、少しだけ余白が残ってしまっている状態です。

＞もしかすると、css/css-custom.cssが無いとかですかね？

こちら初めて聞きました。
恐らくそのようなcssはないかと思われます。

＞あ、スマホでは確認してないので、何かしらあった場合は、
＞メディアクエリ等でマージンの修正はしてください。

こちらですが、スマホはmobile.cssに書かないと反映されないと思うのですが
この認識で間違っていませんでしょうか？

大変お手数ですがよろしくお願いいたします。

css/css-custom.cssは、カスタマイザー→その他→「カスタマイザーのスタイルを外部CSSに書き出す」にチェックを入れると作られます(おそらく)。cssは新しい登録ほど優先されるので、無いのであればカスタマイザーから作っても良いかと思います。チェックするだけですし。

>スマホはmobile.cssに書かないと反映されないと思うのですが

どこに書いても後から読み込むものが優先されます。なので、子テーマstyle.cssでも優先される場合がありますし、それよりも優先されるのが子テーマのmobile.cssかと思います。更にそれよりcss/css-custom.cssは後から読み込まれているようなので、最優先されるのではないかと。
まぁ子テーマmobile.cssで!importantを付けて書けばそれが一番優先されるように思うんですけどね。
現にうちのサイトのcssはほとんどが子テーマstyle.cssだけです（笑）全部1つにまとめたんですけどね。

後から読み込んだcssで!imporatnt付 > 後から読み込んだcss > 元からあるmobile.css > style.css

かと思いきや、

後から読み込んだcssで!important付 > style.css !important付 > 後から読み込んだcss > 元からあるmobile.css

こうなることもあったりするわけです。
しかし、できるだけ!importantは使わないほうが良いです。優先順位がわからなくなりますし。それなら親テーマのcssをコメントアウトなどして、子テーマで統一が一番わかり易いと思います。アップデートして表示がおかしくなったら親テーマの該当箇所をコメントアウトすればよいわけですし。

まぁまだ更に優先されるインラインstyleと言うのもあるんですけどね（笑）一番厄介・凶悪なやつです。
この場合、jQueryで該当部分を除去したりしないといけません$(セレクタ).removeAttr(“style”)など。
headタグにstyleタグで書かれていると、もうどうしようかと笑うしか無いです。sublimeエディタとかでディレクトリごとの検索をしてどいつが書き出しているかを調べないといけませんからね。

と言うことから、同じセレクタの設定なら、後から読み込んだものが優先(と言うより、古いのを上書きします)です。

となるとjQuery最強だったりします。たいていはcssより後に読み込まれますから。
#mainの幅をだして、(.entry x 2)の幅で割ればどれぐらいスペースが残っているのかわかります。それを.entryのマージンで設定すればバッチリいけるんですけど、css-custom.cssで#main .entry { margin: 10px 20px 20px; }で横は良い感じではないかなと思います。ただここらは、#mainのpaddingと.entryのマージンの兼ね合いなので、最適なサイズは色々と試してみてください。

Hidekichi　様

ご返信ありがとうございます。

＞css/css-custom.cssは、カスタマイザー→その他→「カスタマイザーのスタイルを外部CSSに書き出す」にチェ＞ックを入れると作られます(おそらく)。cssは新しい登録ほど優先されるので、無いのであればカスタマイザー＞から作っても良いかと思います。チェックするだけですし。

こちらチェックを入れてみたのですが、cssファイルが生成されませんでした…
親と子のフォルダ両方を確認したのですが…

＞どこに書いても後から読み込むものが優先されます。なので、子テーマstyle.cssでも優先される場合があ＞りますし、それよりも優先されるのが子テーマのmobile.cssかと思います。
＞更にそれよりcss/css-custom.cssは後から読み込まれているようなので、最優先されるのではないかと。

こちらですが、PCの場合は640px以上なので
mobile.cssはそもそも読み込まないのではないのでしょうか？
なのでPCの場合の優先度は、

1）親テーマのstyle.css
2）子テーマのstyle.css
3）スキンのstyle.css
4）テーマカスタマイザーで設定したスタイル

となるのではないのでしょうか？

ちなみにスキンのstyle.cssも干渉してそうで気になります…

!importantは私も出来るだけ使いたくないのですが
使ったら余白の調整が出来ました…
この辺の情報がもう少し出ていればよいのですが…

スマホの話の流れになったのでmobile.cssが出てきましたが、PCだったら読み込みはしないですね。
僕の意図としては、後から読み込んでいるものが優先されると言うことだけです。
問題点としては、marginの指定をしてあった場合、スマホで.entryをwidth:100%にしたとしてもmarginやpaddingは残るのでメディアクエリ等で調整してくださいねと言う事です。
結果的に、!importantでイケて、自分がどこをいじったかわかってるのであればそれはそれで問題ないと思います。

#main {
width: 200px;
position: absolute;
}

#main {
width: 100%;
}

と連続で書いてあったら、結果的に
#main {
width: 100%;
position: absolute;
}
と言うことです。後から書いたものが上書きするわけです。これはファイルを超えても言えます。後から読み込んだものが優先ただそれだけです。なのでheadタグあたりを見て、どのcssファイルがより後に読み込まれているかで判断すればよいわけです。F12キーからweb開発ツールを見たらそんなことしなくてもわかったりしますけども（笑）

css/css-custom.cssについてですが、もしcssフォルダにcss-custom.cssが作られていないというのであれば、ftpソフトあたりでcssフォルダ等のパーミッションを確認してファイルが書き込める状態かを見ておくと良いかも知れません。
さっきfunctions.phpを見てみましたけど、本来はその機能(カスタマイザーのcss書き出し)があれば作られるはずであろうファイルなので。