My footer is ontop :?

davidknag · February 7, 2011

my footer renders ontop...

weird huh?

tested in chrome & firefox

any idea how to fix?

footer.php

<?php
$footer = '<div id="footer" >Copyright &copy 2011 davidknag.com<br/>Part of the <a href="http://www.davidknag.com/">David Knag Network</a></div>'
?>

style.css

a {
text-decoration:none;
color:#888888;
}

a:hover	{
color:#999999;
text-decoration:underline;
}
#footer {
margin-left:60%;
color:#666666;
}
body {
background-color:#191919;
color:#FFFFFF;
}
#box {
color:#000000;
  position: fixed;
  top: 200px;
  left: 32%;
			width:550px;
			background:#afc8de;

			padding:2em 0 2em 0;
			border:solid 10px #1f1f1f;
		 }

form{width:500px; margin:0 auto 0 auto;}
fieldset {border:none; padding:0 0 2em 0;
}
#boxfix{width:500px; margin:0 auto 0 auto;}
fieldset {border:none; padding:0 0 2em 0;
}

index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html>
<head>
<title>Todo</title>
<link rel="stylesheet" href="style.css" type="text/css" media="screen" charset="utf-8"/>
</head>
<body>
<?php
error_reporting(0);
require "mysql.php";
$today = getdate();
if ($_POST['logout']) {
setcookie("loggedin", "0", time()-3600);
}
else {
}
if ($_COOKIE["loggedin"] == 1) {
?>
hi!
<br/>
<form autocomplete="off" action="logout.php" method="POST">
<input value="Log Out" class="logout" type="submit" name="logout">
</form>
<?php
}
else{

$usere = $_POST['user'];
$pwe = $_POST['password'];
if ($_POST['login']){
$qry="SELECT * FROM users WHERE username='$usere' 
AND password='$pwe'";
$result=mysql_query($qry);
if(mysql_num_rows($result)>0) {
echo "<div id='box'><div id='boxfix'>Login Correct! <br/> 1 Second...</div></div>"; 
$expire=time()+60*60*24*30;
setcookie("loggedin", "1", $expire);
header('Location: index.php');
}
else {
echo "<div id='box'><div id='boxfix'><strong>Login Incorrect!</strong><br/>Your Username or Password was Incorrect!</div></div>";
}
}else{

?>
<div id="box">
<form action="<?php echo $_SERVER['PHP_SELF'] ?>" method="POST">
User:<br/><input type="text" name="user"><i>*</i><br/>
Password:<br/><input type="password" name="password"><i>*</i><br/>
<input value="Login" class="submit" type="submit" name="login">
</form>
</div>
<?php include "footer.php";
echo $footer;
?>
<?php 
}
}
?>

</body>
<head>
<html>

cyberRobot · February 7, 2011

The footer is at the top of the page because of your CSS. If you remove the "position:fixed;" from the #box declaration, the footer will appear at the bottom of the page.

Note that there is an HTML error also. At the end, this:

...
</body>
<head>
<html>

Should be:

...
</body>
</html>

davidknag · February 7, 2011

semi-fixed but still at top

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html>
<head>
<title>Todo</title>
<link rel="stylesheet" href="style.css" type="text/css" media="screen" charset="utf-8"/>
</head>
<body>
<?php
error_reporting(0);
require "mysql.php";
$today = getdate();
if ($_POST['logout']) {
setcookie("loggedin", "0", time()-3600);
}
else {
}
if ($_COOKIE["loggedin"] == 1) {
?>
hi!
<br/>
<form autocomplete="off" action="logout.php" method="POST">
<input value="Log Out" class="logout" type="submit" name="logout">
</form>
<?php
}
else{

$usere = $_POST['user'];
$pwe = $_POST['password'];
if ($_POST['login']){
$qry="SELECT * FROM users WHERE username='$usere' 
AND password='$pwe'";
$result=mysql_query($qry);
if(mysql_num_rows($result)>0) {
echo "<div id='box'><div id='boxfix'>Login Correct! <br/> 1 Second...</div></div>"; 
$expire=time()+60*60*24*30;
setcookie("loggedin", "1", $expire);
header('Location: index.php');
}
else {
echo "<div id='box'><div id='boxfix'><strong>Login Incorrect!</strong><br/>Your Username or Password was Incorrect!</div></div>";
}
}else{

?>
<div id="box">
<form action="<?php echo $_SERVER['PHP_SELF'] ?>" method="POST">
User:<br/><input type="text" name="user"><i>*</i><br/>
Password:<br/><input type="password" name="password"><i>*</i><br/>
<input value="Login" class="submit" type="submit" name="login">
</form>
</div>
<?php 
}
}
?>
<?php include "footer.php";
echo $footer;
?>
</body>
</html>

css

a {
text-decoration:none;
color:#888888;
}

a:hover	{
color:#999999;
text-decoration:underline;
}
#footer {
margin-left:60%;
color:#666666;
}
body {
background-color:#191919;
color:#FFFFFF;
}
#box {
color:#000000;
  position: fixed;
  top: 200px;
  left: 32%;
			width:550px;
			background:#afc8de;

			padding:2em 0 2em 0;
			border:solid 10px #1f1f1f;
		 }

form{width:500px; margin:0 auto 0 auto;}
fieldset {border:none; padding:0 0 2em 0;
}
#boxfix{width:500px; margin:0 auto 0 auto;}
fieldset {border:none; padding:0 0 2em 0;
}

footer.php

<?php
$footer = '<div id="footer" >Copyright &copy 2011 davidknag.com<br/>Part of the <a href="http://www.davidknag.com/">David Knag Network</a></div>'
?>

cyberRobot · February 7, 2011

It should be fixed by removing the "position:fixed;" from your CSS declaration for #box.

Sorry, that got buried by my side point.

atrum · February 7, 2011

I don't remember exactly but if something has a fixed position, that means it never moves, and it doesn't position it self relative to the rest of the content.

try setting

position:relative;
bottom:0px;

on the footer

davidknag · February 7, 2011

yeah ol i just noticed that ty

Sign In

My footer is ontop :?

Recommended Posts

davidknag

Link to comment

Share on other sites

cyberRobot

Link to comment

Share on other sites

davidknag

Link to comment

Share on other sites

cyberRobot

Link to comment

Share on other sites

atrum

Link to comment

Share on other sites

davidknag

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information