【Simplicity】ナビゲーションバーの表示がおかしかったので修正してみた

※確定ではありませんが、アップルのフォントfont-family:’Lucida Grande’を使った時のみ表示がおかしくなると思われます。

LucidaGrande表示    Hiragino表示

Simplicityのナビゲーションはデフォルトでドロップダウンリストに対応しており、リスト構造もシンプルだったのでStinger3から引っ越そうかなと検討していました。

http://wp-simplicity.com/

しかし、ナビを見ていると一部気になる箇所が。
simplicity_navi

英語表記のところだけ少しブロックが小さくなっています。その部分はクリックしてもリンク先へ移動出来きないので修正が必要だと思います。

フォントを確認してもfont-family、サイズは同じです。

フォント確認2     フォント確認

font-familyとサイズが同じでも高さが異なることがあるのでしょうか。
少し調べてみましたが、よさげな記事は見つかりませんでした。

CSSの修正

CSSについてはまだまだ勉強中なので、正しい修正かどうかは分かりませんが直してみました。
height追加

#nav ul li a{
    height:20px;
}

a要素に対し高さを指定しただけです。
paddingの単位はemになっているのでemで指定したほうがいいのでしょうか。
とりあえずこの修正で外観に問題はなさそうなので現在「Simplicity」のテーマを使用している方は一時的にこちらの修正をなさってみてはいかがでしょうか。もしくは、ナビゲーション内の英語表記をやめて日本語にするかですね。

さいごに

Simplicityの最新バージョンは1月15日に更新された1.42です。
EO最適化済みのシンプルな無料Wordpressテーマ|Simplicity

まだ全部見たわけじゃありませんが、ナビゲーションについては個人的にすごく気になりました。ここの修正バージョンが出たら「Simplicity」を使わせて頂きたいと思います。

スポンサーリンク
RESAD
RESAD

シェアする

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

フォローする

スポンサーリンク
RESAD