将TopBar填入屏幕末尾

时间:2015-01-15 00:42:45

标签: html css

所以我创建了一个带有注册和登录按钮的导航栏(更像是一个顶部栏),我只是在填充整个显示器时遇到了一些问题。它只是在触摸屏幕末端之前停止。任何修复? http://jsfiddle.net/Karmatix/ngfrzuas/
如果你想在这里看到我的代码。

HTML

<!doctype html>
<html>
<head>
<meta charset="utf-8">
    <title>League of Legion</title>
    <link rel="stylesheet" type="text/css" href="page.css" />
</head>
<body>
<div id="top-background">
        <div id="wrapper">
            <!-- Everything in the top Nav -->
            <div id="Register-Text">
                <ul>
                    <li><p>Don't have an account?</p> <a href="#">Register</a></li>
                    <li><a href="#">Login</a></li>
                </ul>
            </div>
            <!-- End of everything in the top Nav -->
        </div>
    </div>
</body>
</html>

CSS

#top-background {
    background-color: #000000;
    margin-top: -9px;
    position: relative;
}

#wrapper {
    background-color: #000000f;
    max-width: 1100px;
    min-width: 720px;
    margin-left: auto;
    margin-right: auto;
    margin-top: -16px;
}

/*Beginning of top Nav styling */
#Register-Text {
    overflow: auto;
}

#Register-Text ul li {
    color: white;
    display: inline;
    list-style-type: none;
    float: right;
    padding-left: 20px;
    margin-bottom: 10px;
}

#Register-Text ul li p {
    display: inline;
    color: #999;
}

#Register-Text ul li a {
    color: white;
    text-decoration: none;
}

#Register-Text ul li a:hover {
    color: #93C;
}
/* End of top Nav Styling */

1 个答案:

答案 0 :(得分:1)

你可以这样做:

body {
    padding: 0;
    margin: 0;
}

我想添加某种CSS重置,以尝试并规范化浏览器之间的所有默认样式。看看Eric Meyer的http://www.cssreset.com/scripts/eric-meyer-reset-css/。这是我喜欢的人。