...

View Full Version : Background-position and FF



CaptainB
10-14-2007, 01:08 PM
Hi!

How come that when I set my background-position to bottom, that FF dosn't understand it?

It works in IE 6, but not in FF.

How would I make the background STAY alligned to the bottom in FF?

abduraooft
10-14-2007, 01:13 PM
Its working for me as per http://www.w3schools.com/css/pr_background-position.asp
I think there may be some problem(height) in your code.

CaptainB
10-14-2007, 01:16 PM
Well, see if u can spot the error. I can't?


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Behrentzs.com - Page not found!</title>
<style type="text/css">
body { background-color:#000;
background-image:url(gfx/404error.png);
background-position:bottom;
background-repeat:no-repeat;
font-size:13px;
color:#fff;
font-family:Verdana, Arial, Helvetica, sans-serif;
}

h1 { font-size:20px;
color:#ff7700;
}

#text { width:400px;
margin-right:auto;
margin-left:auto;
text-align:center;
filter:alpha(opacity=50);
-moz-opacity:0.5;
opacity:0.5;
}

a { color:#fff;
font-weight:bold;
text-decoration:none;
}

a:hover { color:#ff6600;
}

#copyright {position:absolute;
bottom:0px;
font-size:10px;
}
</style>
</head>

<body>
<div id="text">
<h1>Error 404 - Page not found!</h1><br/><br/>
I'm sorry, but the page you requested might have been deleted, moved or just stolen by aliens!<br/><br/><br/>
Please click <a href="http://www.behrentzs.com">here</a> to go back to Behrentzs.com, or check that you've requested the correct URL, as the page might not exist.
<br/><br/><br/>
Sorry for your inconvenience!
</div>
<div id="copyright">
Copyright &copy; Behrentzs | All rights reserved
</div>
</body>
</html>

Fang
10-14-2007, 01:29 PM
html {
background-image:url(gfx/404error.png);
background-position:bottom;
background-repeat:no-repeat;
background-color:#000;
height:100%;
}
body {
font-size:13px;
color:#fff;
font-family:Verdana, Arial, Helvetica, sans-serif;
}

abduraooft
10-14-2007, 01:32 PM
Hmm.. My assumption was right.
If you add border:1px solid #fff; to your body's CSS, you can see that your body is not stretching to fill the browser area.

So just add html{height:100%;} to fix it:thumbsup:

CaptainB
10-14-2007, 01:35 PM
Ahh, thanks!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum