Very good page indeed !! But I still have a hard time sticking the footer at the very bottom of my page !! Can you guys help me out with that problem?
CODE:
<body>
<div id="container">
<div id="header">
<div id='cssmenu' >
<ul>
<li class="active"><a href="index.html"><span>Présentation</span></a></li>
<li class="has-sub" style="z-index:1005"><a href="index.html"><span>Services</span></a>
<ul>
<li><a href="index.html"><span>Terrassement</span></a></li>
<li><a href="index.html"><span>Excavation</span></a></li>
<li><a href="index.html"><span>Déneigement</span></a></li>
<li class="last"><a href="index.html"><span>Démolition</span></a></li>
</ul>
</li>
<li class="has-sub" style="z-index:1005"><a href="index.html"><span>Nos Équipements</span></a>
<ul>
<li><a href="index.html"><span>Machinerie lourdes</span></a></li>
<li><a href="index.html"><span>Machinerie légères</span></a></li>
<li class="last"><a href="index.html"><span>Autres équipement</span></a></li>
</ul>
</li>
<li class="has-sub" style="z-index:1005"><a href="index.html"><span>Location</span></a>
<ul>
<li><a href="index.html"><span>Machinerie</span></a></li>
<li class="last"><a href="index.html"><span>Autres</span></a></li>
</ul>
</li>
<li class="last"><a href="index.html"><span>Coordonnées</span></a></li>
</ul>
</div>
</div>
<div id="wrapper">
<div id="nav">
<p> </p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed porttitor leo ut mauris posuere, quis laoreet velit scelerisque. Quisque dolor risus, aliquet ac est commodo, vestibulum feugiat massa. Pellentesque sem ante, auctor quis nibh eget, faucibus venenatis augue. Pellentesque nisl massa, blandit sed pharetra nec, laoreet eget velit. Nunc molestie venenatis augue in adipiscing. Quisque consequat eros id quam rutrum, nec imperdiet sem convallis. Quisque nec venenatis eros. Pellentesque id iaculis magna. Maecenas vehicula ultrices massa non convallis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sit amet aliquam dui. Donec in scelerisque nulla. Proin ullamcorper at felis ut scelerisque.</p>
<p>Quisque laoreet urna id nulla vestibulum, dapibus elementum tortor interdum. Interdum et malesuada fames ac ante ipsum primis in faucibus. Duis quis leo enim. Phasellus porttitor, enim vitae adipiscing consequat, ligula nunc porta mauris, vitae malesuada tortor diam a nulla. Integer nisl lectus, aliquet a leo vel, molestie consequat diam. Nam non ultricies augue. Fusce id sapien mi. Praesent tempor purus turpis, quis mattis orci condimentum in. Suspendisse at magna ac purus dignissim suscipit nec nec neque. Donec turpis arcu, ultrices ac mollis quis, molestie eu ligula. Suspendisse potenti. Morbi eleifend eros id ipsum venenatis consequat. Vestibulum laoreet vitae erat non tristique. Proin a libero eros. Duis eu sagittis quam, vitae sollicitudin dolor.</p>
</div>
</div>
<div id="footer">
<div style="clear: both"></div>
</div>
</div>
</body>
</html>
CSS:
body
{
font-family:Tahoma, Geneva, sans-serif;
background-image:url(../Images/fondnoir_001.jpg);
padding: 0px;
margin: 0px;
font-size: 0.9em;
height: auto;
width: auto;
}
html {
height:100%;
margin:0;
padding:0;
}
#nav {
float:left;
width:800px;
height:auto;
background-color:#565656;
filter: alpha(opacity=70); /* internet explorer */
-khtml-opacity: 0.7; /* khtml, old safari */
-moz-opacity: 0.7; /* mozilla, netscape */
opacity: 0.7; /* fx, safari, opera */
border-radius: 15px;
font-family: Tahoma, Geneva, sans-serif;
font-size: 0.8em;
color: #FFF;
padding-top:0px;
padding-left:10px;
padding-right:10px;
text-align: justify;
margin-top:0px;
margin-left: 130px;
}
#header {
float: left;
background-image:url(../Images/header_02.png);
background-repeat:no-repeat;
width: 100%;
height:170px;
top: 0;
left: 0;
border-radius: 15px;
font-family: Tahoma, Geneva, sans-serif;
font-size: 0.7em;
color: #FFF;
text-transform: capitalize;
}
#wrapper {
width:auto;
margin-left:200px;
position:relative;
float: left;
height: auto;
}
#footer {
background-image: url(../Images/footer.jpg);
background-repeat: no-repeat;
height: 50px;
background: blue;
position:relative;
bottom: 0;
width: inherit;
text-align: center;
}
#cssmenu {
margin-left:415px;
position: fixed;
z-index:10;
padding-top: 45px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
}
#container {
width: 100%;
margin-left: auto;
margin-right: auto;
position: relative;
min-height: 99%;
}
Thank you very much for your help !