ストーク19 使い方｜カスタマイズ｜記事とサイドバーの間に余白を作りたい

私のお気に入りのワードプレスのテーマ『STORK19 』。

私のPC環境は、iPad proです。iPadのみでブログを編集しております

おすすめストーク19を詳しく説明 【ストーク19】ブログ初心者におすすめ｜ワードプレスは初心者に簡単？｜アメブロと比較

とても可愛くて使いやすいWordPressテーマなので
楽しくブログ更新していたのですが…

ひとつ、気になるところがありました。
ここの↓

「記事スペース」と右側の「サイドバースペース」。
くっつきすぎる気がするんですよね(･_･;

トップページだと気にならないのですが
記事本文になると↓

右がわギリギリまで文章を書くと
右側のサイドバーの文字が近くなって
「どこまで記事本文の文字？」
と、ぱっと見わかりにくくなってしまう( ´艸｀)

サイドバーを左側に寄せたら良いかと
やってみたりしたのですが…

でもやっぱり、サイドバーは右側にしたい…

どうすれば？プロに頼まないとだめ？
機械オンチの私に出来るかしら？？？

…ということで。
STORK19 を作っている会社の OPENCAGE（オープンケージ） の方に問い合わせしてみました！

CSSをいじる時は、バックアップをとっておいてください。
特に！
この記事は「超機械オンチ」が書いています。
「正しいコード」等わかっておりません。
参考程度にお願いいたしますm(_ _)m

問い合わせ内容『本文とサイドバーの間の余白を作るには？』

私の希望は、

①左端に空白
②本文とサイドバーの間に空白

①本文がもっと中央に寄るように、余白が欲しい
②記事本文と右側のサイドバーの間に、余白が欲しい

ということを伝えました。

オープンケージさんのお返事①『左右に余白できます』

カスタマイズについての質問はNGだったかなぁ…
と思いつつ、ダメもとでの問い合わせでしたが
お返事いただけました（ありがとうございます！）

@media only screen and (min-width: 981px) {
  #main {
    margin-left: 2%;
    margin-right: 4%;
  }
}

ふむふむ。
やってみると…

コードってどこに貼ったらいいの？と思った方はこちらの記事で説明しています

あわせて読もう【ストーク19 使い方】SNSアイコンを1箇所にしたい|カスタマイズ

before

after

確かに中央に寄った！

しかし…
できたら…私のイメージは。

記事スペースとサイドバースペースの
間を分断して、バックグラウンドの色にしたい
（私の場合は白）

もう1度聞いてみることに…（スミマセン）

オープンケージさんのお返事②『本文エリアとサイドバーを分離可能』

以下のコードは私がコピペして貼り付けたものです。
上手くいっていないので、貼らない方が良いです↓

@media only screen and (min-width: 1024px) {
  #inner-content {
    background: none;
    box-shadow: none;
  }
  #main, #sidebar1 {
    background: #f7f3ec;
    padding: 2%;
    -webkit-box-shadow: 0 0 15px rgba(102, 102, 102, 0.2);
    box-shadow: 0 0 15px rgba(102, 102, 102, 0.2);
  }
}

たぶん、機械オンチの私でなければここで、解決！
…となったのでしょう。

しかし。
私がやっても、うまくいきません(T . T)

わかります？
確かに余白はできたけれど
文字が幅ギリギリでなんだか変です（ ; ; ）

再度お問い合わせを…（本当にスミマセン！）

オープンケージさんのお返事③『全角スペース入ってません？』

@media only screen and (min-width:1024px){
#inner-content{
background:none;
box-shadow:none;
}
#main,#sidebar1{
background:#f7f3ec;
padding:2%;
-webkit-box-shadow:0 0 15px rgba(102,102,102,0.2);
box-shadow:0 0 15px rgba(102,102,102,0.2);
}
}

そうしたら！
やっと上手くいきました＼(^o^)／

まさに「こういうイメージ」と
私が思い描いていた通りのデザインに！

OPENCAGE（オープンケージ） さん、
本当にありがとうございました！！！

オープンケージさんに感謝！

CSSに詳しい方なら
「ちょっと、コクウさん何やっての？！」
と思われたでしょうが、
なにしろ機械オンチの私は訳がワカラズ…

最後まで親切丁寧に教えていただいた
OPENCAGE（オープンケージ） さんに本当に感謝しておりますm(_ _)m

やっぱり初心者こそ、ワードプレスは有料テーマ！
アフターフォローも万全なOPENCAGE（オープンケージ）
の「STORK19 」おすすめいたします(*^^*)！

私OPENCAGE（オープンケージ）さんのデザインがすごく好きなんですよね♪

ゲージから鳥が飛んでいくところ、かっこいい＾＾！