-1

CSSのナビゲーションのアクティブな状態に問題があります。アクティブなリンクに向けて矢印をコンテナに揃えたいのですが、テキストを背景画像と一緒に上に移動しないと、矢印が揃えられません。矢印はテキストからオフセットする必要があります。フィードバックをいただければ幸いです。ありがとう!

#mainNav ul li.current a,
#mainNav ul li.current-cat a,
#mainNav ul li.current_page_item a,
#mainNav ul li.current-menu-item a,
#mainNav ul li.current-post-ancestor a,
#mainNav ul li.current_page_parent a,
#mainNav ul li.current-category-parent a,
#mainNav ul li.current-category-ancestor a,
#mainNav ul li.current-portfolio-ancestor a,
#mainNav ul li.current-projects-ancestor a
{
  background: url(http://www.jamiestarcevich.com/wp-content/uploads/2012/12/triangle.png);
  background-repeat: no-repeat;
  background-position:center top;
}
4

1 に答える 1

0

一般的なものの代わりにピクセルまたはパーセントを使用center,topして、矢印を目的の場所に正確に配置できます

矢印用のスペースが必要な場合は、padding-left(またはpadding-rightRTLの場合)を使用します

補足:コードを見ると、ネストされたルールをサポートするLESSなどのCSS拡張機能の使用を検討することをお勧めします。そのため、要素を何度も繰り返す必要はありません。

于 2012-12-30T20:14:26.577 に答える