Question

这真的很奇怪。有时当我重新加载它显示应该在哪里，像这样： alt text

当我将颜色更改为橙色或蓝色（未测试任何其他颜色时，ul会被降低。原因是什么？感谢您的帮助！

#topuserbar a
{
    color:Orange;
}

alt text

这是完整的CSS和HTML。

body
{
    background-image: url('images/test.png');
    background-repeat:repeat;
    margin:0;
    padding:0;
}

#header
{
    background-image: url('images/headerBackground.png');
    background-repeat:repeat;
    width:auto;
}

#headershadow
{
    background-color:Black;
    min-height:2px;
}

#topuserbar
{
    font-family:Georgia;
    font-size:large;    
    float:right;
    margin-top:35px;  
    margin-right:15px;
}

#topuserbar ul
{
}

#topuserbar li
{
    display:inline;
    margin-left:10px;
    color:#fff;
}

#topuserbar .helpicon
{
    position:relative;
    top:4px;
    left:2px;
}

#topuserbar a
{
    color:Blue;
}

#topuserbar a:hover
{
    color:Yellow;
}

/*****************BODY AREA*******************/

#body
{
    border: 1px solid red;
    min-height:800px;
    width:auto;
    margin-left:50px;
    margin-right:50px;    
}

#leftnavigation
{
    border: 1px solid green;
    min-height:500px;
    float:left;
    width:190px;
}

#contentarea
{
    border:1px solid blue;
    min-height:500px;
    float:left;
    width:300;
    margin-left:5px;
    margin-right:5px;
}

#advertisingarea
{
    border:1px solid orange;
    width:150px;
    float:left;
    min-height:500px;
}

.advert
{

}

<%@ Master Language="C#" Inherits="System.Web.Mvc.ViewMasterPage" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title><asp:ContentPlaceHolder ID="TitleContent" runat="server" /></title>
    <script src="../../Scripts/jquery-1.4.1.min.js"></script>
    <script src="../../Scripts/jquery.tipTip.minified.js"></script>    
    <link href="../../Content/Site.css" rel="stylesheet" type="text/css" />
    <link href="../../Content/tipTip.css" rel="stylesheet" type="text/css" />
</head>

<body>    
    <div id="header">
        <img src="../../Content/images/cumaviLogo.png" alt="Cumavi.com - Compras y ventas online en Bolivia!" />    
        <ul id="topuserbar">
            <li>Bienvenidos, <span class="userSalute">Sergio!</span></li>
            <li><a href="#">Mis Anuncios</a></li>
            <li><a href="#">Perfil</a></li>
            <li><a href="#">Ayuda</a><img class="helpicon" src="../../Content/images/helpIcon.png" alt="Help icon." width="20" height="20"/></li>
            <li><a href="#">Cerrar Sesion</a></li>
        </ul>
    </div>
    <div id="headershadow">
    </div>
    <div id="body">
        <div id="leftnavigation"></div>
        <div id="contentarea">sdfg<h1>asdasd</h1></div>
        <div id="advertisingarea">
            <div class="advert">
                <img src="../../Content/images/advertImage.png" alt="Advert" />
            </div>

            <div class="advert">
                <img src="../../Content/images/advertImage.png" alt="Advert" />
            </div>

            <div class="advert">
                <img src="../../Content/images/advertImage.png" alt="Advert" />
            </div>
        </div>
    </div>

    <script type="text/javascript">
        $(function () {
            $(".someClass").tipTip();
        });
    </script>
    <asp:ContentPlaceHolder ID="MainContent" runat="server" />
</body>
</html>

Answer 1

好吧，你的菜单（#topuserbar）是浮动的，容器不是。您可以在css中更改许多内容以设置适当的浮动布局...

- or -

只需更改设置菜单位置的方式，如：

#topuserbar
{
    font-family:Georgia;
    font-size:large;    
    margin-top:35px;  
    margin-right:15px;
    text-align: right;
}

......例如。

有时无缘无故我的ul位置较低

1 个答案: