0

每次我尝试用横幅图像替换站点标题时，格式都会混乱并且不稳定。通常所有应该在标题底部对齐的链接都会浮到顶部并弄乱，有没有人遇到过这个问题并且知道如何解决它？

这是我正在使用的标题：

<header>
    <div class="content-wrapper">
        <div class="float-left">
            <p class="site-title">@Html.ActionLink("FantasiTrade", "Index", "Home")</p>
        </div>
        <div class="float-right">
            <section id="login">
                @Html.Partial("_LoginPartial")
            </section>
            <nav>
                <ul id="menu">
                    <li>@Html.ActionLink("Home", "Index", "Home")</li>
                    <li>@Html.ActionLink("Browse Units", "", new { area = "", controller = "Units"})</li>
                    @{ if (User.Identity.Name != null) { if (User.Identity.Name != ""){
                    <li>@Html.ActionLink("Sell Unit", "Create", new { area = "", controller = "ActiveTrades" })</li>
                    <li>@Html.ActionLink("Your Profile", "profile", new { user = User.Identity.Name, area = "", controller = "ActiveTrades"})</li>}}}
                </ul>
            </nav>
        </div>
    </div>
</header>

我希望链接的“菜单”列表在标题的底部保持对齐，而不是在替换时浮动到顶部：

<p class="site-title">@Html.ActionLink("FantasiTrade", "Index", "Home")</p>

和：

<img src = "mybanner.jpg" />

感谢任何可以帮助我的人！

CSS 按要求，我认为这些是相关部分，实际文件很大，如果您想全部查看，请告诉我：

/* site title
----------------------------------------------------------*/
.site-title {
    color: #000000;
    font-family: "Franklin Gothic Medium", Rockwell, Consolas, "Courier New", Courier, monospace;
    font-size: 3em;
    margin: 0px;
    margin-left: 25px;
}

.site-title a, .site-title a:hover, .site-title a:active {
    background: none;
    color: #000000;
    outline: none;
    text-decoration: none;
}


/* login
----------------------------------------------------------*/
#login {
    display: block;
    font-size: .85em;
    margin: 0 0 10px;
    text-align: right;
}

    #login a {
        background-color: #d3dce0;
        margin-left: 10px;
        margin-right: 3px;
        padding: 2px 3px;
        text-decoration: none;
    }

    #login a.username {
        background: none;
        margin: 0;
        padding: 0;
        text-decoration: underline;
    }

    #login ul {
        margin: 0;
    }

    #login li {
        display: inline;
        list-style: none;
    }


/* menu
----------------------------------------------------------*/
ul#menu {
    font-size: 1.3em;
    font-weight: 600;
    margin: 0 0 5px;
    padding: 0;
    text-align: right;
}

    ul#menu li {
        display: inline;
        list-style: none;
        padding-left: 15px;
    }

        ul#menu li a {
            background: none;
            color: #999;
            text-decoration: none;
        }

        ul#menu li a:hover {
            color: #333;
            text-decoration: none;
        }
4

1 回答 1

0

尝试 <img src = "mybanner.jpg" />它可能也是某个地方的未闭合标签，尽管您的标题看起来很干净，除了未丢失的双引号。

于 2013-07-03T02:31:59.433 回答