Question

CODE

<div class="navheader">
     <ul class="navuseraccess">
        <li><a runat="server" id="mnuAccount" href="AccountSettings.aspx">My Account</a></li>
     </ul>
</div>

CSS

div.navheader {
    overflow: hidden;
    position: absolute;
    right: 0;
    bottom: 0;
    width: 775px;
    height: 43px;
    margin: 0;
    padding: 0 20px 0px 20px;
    list-style-type: none;
    background-image: url(../images/header_bkg_navmain.jpg);
    background-repeat: no-repeat;
}

ul.navuseraccess {
    float: right;
    height: 43px;
    margin: 0;
    padding: 0;
    list-style-type: none;
}
.navuseraccess li {
    float: left;
    margin: 0;
    padding: 0;
    color: #fff;
    font-size: 13px;
    line-height: 43px;
}
.navuseraccess li a {
    display: block;
    height: 43px;
    color: #fff;
    margin: 0;
    padding: 0 8px;
    text-decoration: none;
    line-height: 43px;
}

我要做的是添加一个新的listitem-anchor，但希望它显示在现有的下面，而不是在它旁边。所以我猜我将不得不将现有的一个向上移动，然后在它下面添加一个新的。

Answer 1

您不需要float元素。它们已经收缩包装，因为它们包含在position: absolute元素中。只要您删除height和width属性，此元素就会根据需要增长，并固定在页面的右下角。

查看实际操作：http://jsfiddle.net/MJrfX/

CSS - 帮助设置菜单项的样式

1 个答案: