1

我有以下代码从这里生成一些胖菜单：

<ul id="menu">

        <li class="menu_right"><a href="" class="drop">1 column</a>
            <div class="dropdown_1column align_right">

                    <div class="col_1">

                        <ul class="simple">
                            <li><a href="#">FreelanceSwitch</a></li>
                            <li><a href="#">Creattica</a></li>
                            <li><a href="#">WorkAwesome</a></li>                            
                        </ul>   

                    </div>

            </div>
        </li></ul>

风格是：

#menu .menu_right {
    float: right;
    margin-right: 0px;
}
#menu li .align_right {
    /* Rounded Corners */
    -moz-border-radius: 5px 0px 5px 5px;
    -webkit-border-radius: 5px 0px 5px 5px;
    border-radius: 5px 0px 5px 5px;
}
#menu li:hover .dropdown_1column, 
#menu li:hover .dropdown_2columns, 
#menu li:hover .dropdown_3columns,
#menu li:hover .dropdown_4columns,
#menu li:hover .dropdown_5columns {
    left: -1px;
    top: auto;
}
#menu li {
    float: left;
    display: block;
    position: relative;
    padding: 4px 10px 4px 10px;
    margin-right: 30px;
    margin-top: 7px;
    border: none;
}
#menu li:hover {
    border: 1px solid #777777;
    padding: 4px 9px 4px 9px;
    -moz-border-radius: 5px 5px 0px 0px;
    -webkit-border-radius: 5px 5px 0px 0px;
    border-radius: 5px 5px 0px 0px;
}
#menu li a {        
    display: block;
    outline: 0;     
}

如果从right:-1px;中删除#menu li:hover .align_right，则下拉列表的右边缘不再与父项的右边缘对齐，即菜单栏中的“1 列”（而不是下拉列表的左边缘与父项对齐）。

权利的消极立场有什么意义？通常，左/右的负值具有隐藏元素的目的，就像下拉菜单发生的那样，即它们通常由于左负而被隐藏，并且当左不再为负时显示。

4

1 回答 1

4

我得到了解决方案，请检查它ht​​tp://jsfiddle.net/v4Jwu/

HTML

<select>
<option value="1">Client: Zac Brown Band</option>
<option value="2">Saab</option>
<option value="3">Mercedes</option>
<option value="4">Audi</option>
</select>

CSS

select { direction: rtl; }
于 2013-10-09T05:10:49.490 回答