我正在尝试创建一个与父元素右侧对齐的水平导航.您可以在
http://kaffeeprinzen.jag-aelskar.de/的“Espresso”中看到导航.
我的HTML是:
<ul id="menu-standard"> <li id="menu-item"><a>Item 4</a></li> <li id="menu-item"><a>Item 3</a></li> <li id="menu-item"><a>Item 2</a></li> <li id="menu-item"><a>Item 1</a></li> </ul>
我的CSS是:
.menu li { float: right; margin-left: 20px; }
这样做是唯一的问题是列表中的顺序是错误的.第一个项目是HTML代码中的最后一个.
任何提示给我?非常感谢!
雅尼斯
解决方法
尝试漂浮ul,而不是每个li.每个li可以向左浮动.
#menu-standard { float: right; } #menu-standard li { float: left; }
示例:http://jsfiddle.net/hunter/HsUTQ/
float:right将浮动物品,按顺序排列到右边.意思是第一个元素将是最右边的,然后是第二个元素,下一个最右边的等等.