Jag blir galen på den j---a footern! Någon som kan hjälpa?
Efter ett det här krabbat skitlänge så har jag nu fått panik och bestämde mig för att bryta upp sidan i molekyler för att fastslå vad som är fel...
Såhär ser min sida ut just nu: http://www.triphys.com/test
Som ni ser så har footern fastnat... Allt fungerade fint när jag inte hade någon text i content-boxen, men så fort jag la till text i den så vägrade footern sitta fast i botten.
min index.php ser ut såhär:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />
</head>
<body>
<div id="wrapper">
<div id="header">Header</div>
<div id="container">
<div id="welcomesegment">
<div id="welcome">Welcome</div>
</div>
<div id="portfolio">Portfolio</div>
<div id="contentcontainer">
<div id="content"><?php include("text.txt"); ?></div>
</div>
<div id="social">Social</div>
</div>
</div>
<div id="push"></div>
<div id="footer">Footer</div>
</body>
</html>
och min CSS ser ut som följande:
/*------------------------------------------------------------------------------------------*/
@charset "UTF-8";
/*------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------*/
body {
margin:0px;
padding:0px;
background-image:url(bg.jpg);
background-repeat:repeat;
font-family:Arial, Helvetica, sans-serif;
color:#4d4d4d;
font-size:12px;
line-height:19px;
height:100%;
}
/*------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------*/
#wrapper {
width: 1000px;
min-height:100%;
height: auto;
height: 100%;
position: relative;
margin-left: auto;
margin-right: auto;
margin-bottom: 100px;
}
#container {
width:1000px;
margin:0 auto 0 auto;
position:relative;
}
#header {
background-color:#e84ebd;
height:112px;
display:block;
font-size:10px;
text-decoration:none;
margin-left:auto;
margin-right:auto;
position:relative;
}
#welcomesegment {
background-color:#2469e9;
width: 1000px;
position:relative;
}
#welcome{
background-color:#dcdee0;
clear:both;
margin:10px 140px 10px 140px;
text-align:center;
}
#portfolio {
background-color:#3eed63;
height:150px;
display:block;
font-size:10px;
text-decoration:none;
margin-left:auto;
margin-right:auto;
position:relative;
}
#contentcontainer {
background-color:#898b8a;
width: 1000px;
position:relative;
}
#content{
background-color:#d3d3d3;
clear:both;
margin:10px 140px 10px 140px;
text-align:center;
}
#social {
background-color:#f02735;
height:60px;
display:block;
font-size:10px;
text-decoration:none;
margin-left:auto;
margin-right:auto;
position:relative;
}
#footer {
background-color: #a69f92;
position:absolute;
bottom:0;
width:100%;
height:100px;
}
#push {
height:100px;
clear: both;
}
Vore oerhört tacksam för hjälp!
