html - メニュー項目の矢印を揃える方法は?

Question

そのようなメニューがあり、アイテムに子アイテムがある場合は矢印があります。cssコンテンツプロパティを使用して矢印を配置しますが、矢印を行の最後に配置できません。

<ul id="menu-bar">
    <li><a>homepage</a></li>
    <li><a>about us</a></li>
    <li><a>services</a>
        <ul>
            <li><a>service 1</a>
                <ul>
                    <li><a>service 1A</a></li>
                    <li><a>service 1B</a></li>
                </ul>
            </li>                                    
        </ul>
    </li>
</ul>

これは私のcssです

#menu-bar:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

#menu-bar li ul li > a:after {
    content: '▶';
}

Answer 1

右に揃えようとしている場合は、これを試してくださいhttp://jsfiddle.net/omcuL0vw/

#menu-bar li ul li > a:after {
float:right;
content: '▶';
}