CSS属性在左侧显示子列表

Question

我有一个看起来like this的菜单，在“tanfa演示示例”上盘旋的子列表来自RHS

问题是，在我的情况下，整个菜单都在extreme right上。我希望子列表出现在LHS上。

我尝试过使用CSS“left：0; top：0;”属性，但这只会在其父元素的左上角显示子列表，其中它重叠如下，

我希望菜单从其父级的“left：0; top：0”开始，然后向左滑动。我更喜欢通过CSS的解决方案。

Answer 1

尝试right: 100%代替left: 0，它基本上告诉您的菜单应将其左边缘定位到其父级的最左边缘。 right: 100%应该告诉它将最右边与最左边的父菜单对齐。希望这有帮助！

Answer 2

如果我理解正确，要让子列表显示在父级左侧，请将left属性设置为-100%。

#menu ul ul ul {
position: absolute;
top: 0;
left: -100%;
width: 100%;
}

http://jsfiddle.net/G5yQx/1/

Answer 3

可以试试这个： 为子项设置负余量（弹出列表）= 2 x父列表的边距

即：在弹出列表中添加这样的内容。

{
    margin: 0 -300px; /* 0 denotes top and bottom margin : 0 */
}

PS：虽然看着你的代码是不可取的。将需要更多代码更改才能正常工作

Answer 4

left：0 表示您定义它的位置。那么，解决方案是什么，而不是左：0 ，你可以定义 left：auto; 。写得像这样：

#menu ul ul ul {
position: absolute;
top: 0;
left:auto;
right:100%;
width: 100%;
}

或删除左：0 ，因为jakee已经解释过了。

选中此http://jsfiddle.net/wEExT/9/