Это делает мою голову. Я не могу заставить текст выравниваться вертикально в нижнем колонтитуле. Основной текст - это то, где я хочу его посередине, но ссылки для входа заканчиваются в верхней части нижнего колонтитула. Также, когда я вхожу в систему и у меня отображаются другие параметры, текст справа от нижнего колонтитула не отображается. Пожалуйста помоги.
Нижний колонтитул:
<?php
include ("Includes/closeDB.php");
?>
<footer>
<div class="footer-wrapper"></div>
<div class="footer-wrapper">
<div class="float-left"><p id="social">Site Map</p></div>
<div id="login">
<?php
if (logged_on())
{
echo '<li><a href="/logoff.php">Sign out</a></li>' . "\n";
echo '<li><a href="/addpage.php">Add</a></li>' . "\n";
echo '<li><a href="/selectpagetoedit.php">Edit</a></li>' . "\n";
echo '<li><a href="/deletepage.php">Delete</a></li>' . "\n";
if (is_admin())
{
}
}
else
{
echo '<li><a href="/logon.php">Admin Log In</a></li>' . "\n";
}
?>
<?php if (logged_on()) {
echo "<div class=\"welcomeMessage\">Welcome, <strong>{$_SESSION['username']}</strong></div>\n";
} ?>
</div>
<div class="float-right"><p id="social">© Swing and Putt 2014</p></div>
</div>
</footer>
</body>
</html>
CSS:
.float-left {
float: left;
color: #000000;
text-align: left;
padding-left: 10px;
}
.float-right {
float: right;
color: #000000;
text-align: right;
padding-right: 10px;
}
footer {
clear: both;
font-size: 12pt;
height: 30px;
margin-top: -30px; /* negative value of footer height */
position: relative;
background-color: #00BFFF;
padding: 5px;
}
footer .footer-wrapper {
}
/* login
----------------------------------------------------------*/
#login {
display: block;
font-size: 12pt;
font-family: Arial;
float: left;
}
#login a {
margin-left: 10px;
margin-right: 3px;
padding: 2px 3px;
text-decoration: none;
}
#login a.username {
background: none;
margin-left: 0px;
text-decoration: underline;
}
#login ul {
margin: 0;
}
#login li {
display: inline;
list-style: none;
}
Надеюсь, что все имеет смысл. Я борюсь с материалом типа PHP.
Здесь я использую демо-ссылки нижнего колонтитула и вставляю целые html и css. Вы только что изменили нижний колонтитул класса CSS
height: 180px;
margin-top: 0px;
/* отрицательное значение высоты нижнего колонтитула */
эти и добавить #login li block
float: left;
clear: both;
margin-bottom: 10px;
эти три свойства и надежду, которые решают вашу проблему. Также я приложил свое изображение предварительного просмотра демонстрационного меню, которое вы видите, что это правильно или неправильно.
<html>
<head>
<title>Demo Title</title>
<style type="text/css">
.float-left {
float: left;
color: #000000;
text-align: left;
padding-left: 10px;
}
.float-right {
float: right;
color: #000000;
text-align: right;
padding-right: 10px;
}
footer {
clear: both;
font-size: 12pt;
height: 180px;
margin-top: 0px; /* negative value of footer height */
position: relative;
background-color: #00BFFF;
padding: 5px;
}
footer .footer-wrapper {
}
/* login
----------------------------------------------------------*/
#login {
display: block;
font-size: 12pt;
font-family: Arial;
float: left;
}
#login a {
margin-left: 10px;
margin-right: 3px;
padding: 2px 3px;
text-decoration: none;
}
#login a.username {
background: none;
margin-left: 0px;
text-decoration: underline;
}
#login ul {
margin: 0;
}
#login li {
display: inline;
list-style: none;
float: left;
clear: both;
margin-bottom: 10px;
}
</style>
</head>
<body>
<footer>
<div class="footer-wrapper"></div>
<div class="footer-wrapper">
<div class="float-left"><p id="social">Site Map</p></div>
<div id="login">
<ul>
<li><a href="/logoff.php">Sign out</a></li>
<li><a href="/addpage.php">Add</a></li>
<li><a href="/selectpagetoedit.php">Edit</a></li>
<li><a href="/deletepage.php">Delete</a></li>
<li><a href="/logon.php">Admin Log In</a></li>
</ul>
</div>
<div class="float-right"><p id="social">© Swing and Putt 2014</p></div>
</div>
</footer>
</body>
</html>