Ciao a tutti, stò impazzendo con questo codice, da quando ho inserito il margin top per il content non riesco a togliere lo scroll e a far stare il footer in fondo.Aiuto!
Così è a posto:
<!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>Documento senza titolo</title>
<style type="text/css">
html {
height: 100%;
}
* {
margin: 0;
padding: 0;
}
body {
background-image: url(images/bg_body.png);
background-repeat: repeat-x;
background-position: left bottom;
height: 100%;
background-color: #CCC;
}
#container {
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
height: 100%;
width: 960px;
}
#content {
background-color: #FFF;
padding-bottom:65px;
height: 400px;
}
#footer {
clear: both;
position: relative;
z-index: 10;
height: 65px;
margin-top: -65px;
width: 960px;
margin-right: auto;
margin-left: auto;
background-color: #F4F4F4;
}
#footer #nav ul {
margin: 0px;
padding: 0px;
list-style-type: none;
}
#footer #nav {
margin-top: 0px;
margin-bottom: 0px;
}
#footer #nav ul li {
float: left;
margin-top: 0px;
margin-right: 0.15em;
margin-bottom: 0px;
margin-left: 0.15em;
}
#footer #nav ul li a {
line-height: 65px;
height: 65px;
float: left;
display: block;
color: #cc3333;
text-align: center;
text-decoration: none;
font-size: 16px;
}
#footer #nav a img {
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
#footer #nav ul li a:hover {
background-color: #CCC;
color: #FFF;
}
</style>
</head>
<body>
<div id="container">
<div id="content">Content Here.</div>
</div><!—End Container—>
<div id="footer">
</div>
</body>
</html>
Se inserisco un margin top di 30px al divcontent il footer si alza e c'è lo scroll

Rispondi quotando