Question

我有一个只用CSS编写的下拉菜单。它应该看起来像item | item | item | ＆lt; - 页面角落。但它现在得到了它的下拉宽度。我附上一张图片以使其干净：

http://i.stack.imgur.com/a1Esv.jpg

所以电源按钮应该在右侧，它的下拉应该向左移动。

我的代码（CSS）：

span.topnavright {
    color:white;
    float: right;
    vertical-align: middle;
    padding-right: 0.7em;
    padding-left: 0.7em;
    display: table-cell;
}
span.topnavright:hover {
    width: auto;
    height: auto;
    background: #464741;
}
div.menutop {
    background: #464741;
    color: white;
    visibility: hidden;
    right: 0px;
    position: relative;
    float: left;
}
span.topnavright:hover > div.menutop {
    visibility: visible;
    position: relative;
}

和我的HTML：

 <span class="topnavright">
                <i class="icon-power"></i>
                <div class="menutop">
                    LOLOLO<br />
                    kdsajfeiéfnédskvmdasévjdsaésvdasjdsf
                </div>
             </span>
 <span class="topnavright">
                haha
             </span>
 <span class="topnavright">
                haha
             </span>

我的小提琴：http://jsfiddle.net/m46F6/2/

感谢您的帮助！

Answer 1

将此添加到您的css

.icon-power{float:right;}

CSS下拉菜单对齐不起作用

1 个答案: