Ik heb een klein deel van mijn inlog scherm gemaakt en er klopt nu al iets niet, Mijn css werkt maar voor de helft:
index.php:
<!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>
<title>Geen titel</title>
<meta http-equiv="Content-Type" content="text/html"/>
<meta name="author" content="Yearupie" />
<meta name="publisher" content="Yearupie" />
<meta name="robots" content="index all, follow" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<link rel="stylesheet" type="text/css" media="screen" href="css/login.css" />
<script type="text/javascript" src="js/jquery.js"></script>
</head>
<body>
<div id="main">
<form action="login.php" method="post">
Gebruikersnaam:<br/>
<input type="text" name="username"/>
<br/>
Wachtwoord:<br/>
<input type="password" name="pass"/><br/>
<input type="submit" value="Inloggen" name="submit"/>
</form>
</div>
</body>
</html>
css/login.css:
body{
background: #00520E;
}
div#main{
background-image:url('images/login/bg.png') no-repeat;
width: 701px;
height: 100%;
margin-left: auto;
margin-right: auto;
text-align: left;
background: #00520E;
overflow: auto;
}
Wat er nu niet werkt:
- Er is geen achtergrond plaatje
- De div heeft geen hoogte van 100%
Normaal zou dit toch gewoon moeten werken?
Dit zegt firebug:
body {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:#00520E none repeat scroll 0 0;
}
div#main {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:#00520E none repeat scroll 0 0;
height:100%;
margin-left:auto;
margin-right:auto;
overflow:auto;
text-align:left;
width:701px;
}
Weet iemand hoe ik dit goed krijg?