インラインコメントのレイアウトを変更する

RW3.6検証済み
このエントリの内容は RapidWeaver 3.6 を使用して検証、カスタマイズされた時のものですが、このバージョンでの動作を保証するものではありませんのでご注意下さい。また、表示の無いバージョンでは動作しない、エラーが出ないという意味ではありません。
ブログページで、コメントをインラインで表示すると本文とコメントの部分が近すぎてテーマによっては見づらいことがあります。

そこで、コメント部分を見やすくするために本文との間にスペースをとったり、コメント部分を枠で囲いたい場合は、CSSを利用するのですが、
テーマのパッケージを開いてstyle.cssを見ても該当するものが無いことがあります。

ソースを確認すると、インラインコメントは「
.blog-entry-comments-inline」というclassでレイアウトされていることがわかりました。
なぜかわかりませんが、
style.cssの中にはこの「.blog-entry-comments-inline」というclassがなかったので、style.cssにこのclassを追加してレイアウトを変更しました。(ページインスペクタで追加してやっても良いと思います。)


例えば、コメントの上にスペースが欲しい場合は、

.blog-entry-comments-inline { margin-top: 30px; }


コメントの部分を枠で囲みたい場合は、

.blog-entry-comments-inline { border: 1px solid #fff; }


みたいな感じでしょうか。このブログは今のところBravoというテーマを使ってますが、コメントの部分を波線で囲んでみました。(エントリのタイトルをクリックするとインラインコメントを確認出来ます。)
ちなみにソースはこれ↓

.blog-entry-comments-inline { border: 1px dashed #fcba48; margin-top: 30px; padding: 0 15px; }

なぜだか改行が出来ないので見難くなってます…。

blog comments powered by Disqus