Question

我有来自here的以下代码，它会生成一些胖菜单：

<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列”（而不是左边缘）下拉与父母对齐）。

右侧负面立场的意义是什么？？通常，左/右的负值具有隐藏元素的目的，就像下拉时发生的那样，即它们由于负向左而正常隐藏，并且在左侧不再为负时显示。

Answer 1

我得到了解决方案，请检查http://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; }

对齐下拉菜单的右边缘

1 个答案: