Gushのスタイル編集 :番号リストの反映

公開日:  最終更新日:2014/09/21

スタイル編集前の状態

並行して書いているブログの下書きをしているときに[番号リスト]を適用してもプレビュー画面に反映されないので困っていました。

投稿画面(ビジュアル)では↓のように番号表示になっているのですが、

プレビュー表示にすると、こんな感じ↓

スタイルの定義に問題があることはなんとなく分かるのですが、どこをどう弄れば良いのやら。ネットでググッてみてもうまく探せないし、対処方法が分からず困っていたら…。

Gush2公開!

Gushを使い始めたばかりなのに、もうGush2かぁ…と思いつつ、ローカル環境のWordPressにインストールしてみると…。あれっ?同じ文章、同じ設定なのにちゃんと番号表示になっているではないですか?

そこで、GushとGush2のスタイルシート(Style.css)を見比べてみました。番号リストにするためのタグは<ol>…</ol>なので、それを目当てに探します。

Gush2

Gush2には、”記事内指定”の欄にそれらしきものが記述されています。

Gush

Gushには、”記事内指定”の欄に<ol>…</ol>の記述が見当たりません。

比較した結果、↓なんとなくこれが目当てのタグのような気がしてきました。
#article_body ol {
    list-style: decimal inside;
    margin-bottom: 24px;
}

#article_body ul li,
#article_body ol li {
    margin: 0.8em 0;
    padding-left: 1em;
    text-indent: -1.5em;
    margin-left: 0.5em;
}

GushとGush2ではcssの適用先を記載したidセレクタ(#で始まるワード)が違うようなので、#article → #entryに書き換えたで、#entry_body ul {…}の下に追記しました。

編集後の状態


番号が反映されました^^) 行間が少し開き気味ですがこれはこれで良いような気もしますのでひとまずこれで一件落着です。

ご一読ありがとうございました。

スポンサーリンク

シェアありがとうございます

  • このエントリーをはてなブックマークに追加
  • Pocket

関連記事-こちらもどうぞ

  • 記事はありませんでした

Your Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">

PAGE TOP ↑