[STINGER5]番号付リストの文字が欠ける→直った

この記事は約2分で読めます。

STINGER5に変更したわけなのですが、記事中の左端が欠けているところがあります。

  • 「番号付リスト」に付く数字の左側が欠けてしまう。
    lack-ol-li-number
  • 枠線の左側が欠けてしまう。(プラグイン「WP-Note」を使用)
    lack-division-frame

とりあえず、数字が欠けてしまうのを直してみようと思います。

スタイルシート(style.css)を眺めてみると、「リスト」の定義がありました。

.post ol {
    list-style-type: decimal;
    padding-top: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    padding-left: 20px;
    margin-left: 20px;
    margin-left: 20px;
    margin-bottom: 20px;
}
.post ol li {
    font-size: 17px;
    line-height: 27px;
}

「margin-left: 20px;」を追加してみたところ、リスト番号がちゃんと表示されました。

recovery-ol-li-number

もうひとつ、同じ定義をしている部分(スマートフォン用)があるので、そちらも同様に直しておきました。

「10px」だと、10の位の数字が欠けてしまいました。100以上のリストを使う場合だと「20px」でも欠けてしまうかも?(そうそう無いですね。)

とりあえず、直さないといけないと思った番号付きリストは直ったので、WP-Noteの枠の方はまたその内考えようと思います。

軽く検索してみたものの、同じ事例が見つからず?

もしかしたらSTINGER5関連では無くて、入れているプラグインに寄る現象なのかも知れません。

↓表示チェック用

  1. 番号付リスト・一行目
  2. 番号付リスト・二行目
  3. 番号付リスト・三行目
  4. 番号付リスト・四行目

[2014/02/07追記]

NEXUS7で見たところ、直っていませんでした…。

margin-leftを大きくすると改善されるものの、今度はPCで右に行きすぎちゃったりしそうなので当面放置で。

コメント

タイトルとURLをコピーしました