Bonjour,
J'ai un petit problème avec le site que je suis en train de réaliser. J'ai beau cherché sur les forums et sur des tuto je n'arrive pas à trouver une solution qui correspond à mon problème.
Je voudrais coller mon footer en bas de la page (sans débordement de fond en dessous). Mon footer se compose uniquement d'une image avec du texte par dessus.
Voici mon code html :
et mes css :
J'espère être assez clair dans ce que je recherche, merci beaucoup !
J'ai un petit problème avec le site que je suis en train de réaliser. J'ai beau cherché sur les forums et sur des tuto je n'arrive pas à trouver une solution qui correspond à mon problème.
Je voudrais coller mon footer en bas de la page (sans débordement de fond en dessous). Mon footer se compose uniquement d'une image avec du texte par dessus.
Voici mon code html :
<div id="wrap">
<div id="main">...</div>
<footer>
<img id="footer" src="img/footer.png" alt="herbe">
<p>ET VISITEZ AUSSI NOTRE SITE <a
href="http://gurtner.fr/">WWW.GURTNER.FR</a></p>
</footer>
</div>
et mes css :
html{
height: 100%;
}
* {-moz-box-sizing: border-box; box-sizing: border-box;}
body{
position: relative;
height: 100%;
background-color: #dd0028;
}
#wrap{
position: relative;
display: flex;
flex-direction: column;
}
#main{
position: relative;
flex-grow: 1;
}
/*Footer*/
footer > p{
color: white;
font-family: "Helvetica", sans-serif;
font-size: 3vw;
text-align: center;
margin-bottom: 6.5%;
position: absolute;
right: 10px;
left:10px;
bottom: 0;
}
footer > p > a {
color: white;
text-decoration: none;
font-family: "Helvetica Bold", sans-serif;
}
J'espère être assez clair dans ce que je recherche, merci beaucoup !