我无法将页脚()放在页面中心。我能够使它停留在页面底部,但不能居中。

我在#footer中添加了left: 50%,但是将其向右对齐。同样,<hr>标记仅运行其下方文本的范围。当我从div中取出它时,它漂浮在页面中间。关于如何居中的任何想法(最好使用%,因为我将其嵌入到具有不同对齐设置的另一页中)。

这是链接:http://jsbin.com/fajosekosu/2/edit

您的意见非常赞赏。

<!DOCTYPE html>
<html>
<head>

<style>

body {
    width: 100%;
    height: 100%;
    text-align:center;
    margin: 0 auto;
}

#footer {
    text-align:center;
    margin: 0 auto;
    position:fixed;
    bottom:0;
    left: 50%;

}

a {
    text-decoration: none;
    color: black;
    padding-right: 20px;
    padding: 15px;
    list-style: none;
    display: inline-block;
}

a:hover {
    color: white;
}

</style>
  <meta charset="utf-8">
  <title>Footer</title>
  <link type="text/css" rel="stylesheet" href="/LESSON5/5_Signup_CSS.css">

</head>
<body>

    <div id="footer">
    <hr>
    <footer>
        <a href="/LESSON5/1%20-%20LOGIN.php">Login</a>
        <a href="/LESSON5/2%20-%20CREATE%20AN%20ACCOUNT.php">Create Account</a>
        <a href="/LESSON5/3%20-%20HOMEPAGE%20:%20WELCOME.php">Homepage</a>
        <a href="/LESSON5/4%20-%20LOGOUT%20PAGE.PHP">Logout</a>
    </footer>
</div>

</body>
</html>

最佳答案

添加到页脚CSS

width: 100%;

07-24 09:44
查看更多