次のコードでクラス .page-has-children をターゲットにしようとしています:
<div id="dc_jqverticalmegamenu_widget-2" class="widget sidebarwidget ">
<div class="dcjq-vertical-mega-menu" id="dc_jqverticalmegamenu_widget-2-item">
<ul id="menu-media-intellectual-property" class="menu">
<li id="menu-item-2674" class="page-has-children menu-item menu-item-type-post_type menu-item-object-page menu-item-2674">
<a href="http://saracens.staging.wpengine.com/commercial-clients/commercial-litigation/media-and-intellectual-property">Media and Intellectual Property</a>
<ul class="sub-menu">
<li id="menu-item-2672" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2672">
<a href="http://saracens.staging.wpengine.com/commercial-clients/commercial-litigation/media-and-intellectual-property/it-and-software-disputes">IT and Software Disputes</a>
</li>
<li id="menu-item-2673" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2673">
<a href="http://saracens.staging.wpengine.com/private-clients/civil-litigation/media-and-intellectual-property/trademarks-and-patents">Trademarks and Patents</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
複数のバリエーションを試しましたが、これがうまくいくはずだと確信していました:
#dc_jqverticalmegamenu_widget-%ID%-item li.page-has-children {}
私も試してみました
div.dcjq-vertical-mega-menu li.page-has-children {
background: url(images/arrow-right.gif) no-repeat -3px 0px;
padding: 0 0 0 15px;
cursor: pointer;
}
このフォーラムの投稿からの推奨事項も試しました: http://css-tricks.com/forums/discussion/10960/target-a-class-inside-id/p1
子を持つメニュー項目に矢印が表示されることはありません。