2012-07-10 85 views
0

一个朋友给我这个HTML和CSS:CSS菜单右侧有标记对齐:UL> LI> UL> LI

http://jsfiddle.net/LGFYE/2/

我的工作是在一个CMS使用它,但是这一段代码有几个问题标记:在UL

  • LI> SPAN内每个L1后

    • BR与管道字符只为设计的缘故
    • 子页面的顺序恢复

    我最好的尝试是这样的:

    http://jsfiddle.net/MQLZh/1/

    但我也有一个问题:

    • 间距为子菜单的右侧是不通用的,它总是100像素

    我一直在挣扎几个小时,并希望有人知道j最好的方式。我很想学习另一个CSS技巧或两个。此外,最终的解决方案必须在IE7 +中“工作”。 “工作”,如“没有破碎”,但不一定完全相同或“设计完美”。

    我很欣赏任何努力,谢谢!

  • +0

    ,因为你的权利是100px&所有李的全宽,所以如果你删除右:100px;子菜单将坚持极右。所以,最好给第一层固定的宽度。 – SVS 2012-07-10 07:36:34

    +0

    我宁愿避免任何固定的宽度,因为我无法预测在CMS中使用什么。 – 2012-07-10 07:41:39

    +0

    你想要这样的东西http://jsfiddle.net/surendraVsingh/MQLZh/2/ – SVS 2012-07-10 07:57:40

    回答

    1

    试试这个:http://jsfiddle.net/MQLZh/3/

    让我知道你什么都需要改变

    其实

    ,这个你不必改变HTML标记,无论是工作,但:http://jsfiddle.net/MQLZh/4/

    +0

    这真是太棒了!你能提供一些关于你改变的提示吗? – 2012-07-10 09:58:45

    +0

    我调整了嵌套ULs的CSS,使它们相对定位,然后在悬停时显示模式更改为内嵌块,然后调整位和片以使它们位于同一行上 - 将锚链接向右侧移动等。查看你的和我的CSS之间的区别。 – AddiktedDesign 2012-07-10 10:14:35

    +0

    谢谢。 它看起来像“清楚:正确”做了定位LI的技巧,而没有阻止它们,从而丢失了LI宽度的信息。 – 2012-07-10 11:17:00