Bonjour a tous, j'ai un problem concernant les div de mon template..
Alors voila je vous donne mon sitehttp://csource.free.fr
Alors ceux qui ont fire bug installé, vous pourrez remarqué que mon div #midle-contant se chevauche avec mon #footer!
J'ai tout essayer meme en mettant margin-top a mon footer mais malheureusement ca ne marche pas!
Voici le code:
body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
margin: 0;
padding: 0;
}
div {
padding:0;
margin:0;
}
#main-content {
height:100%;
width: 779px;
margin: 0 auto;
background-color:#CCCCFF;
}
#header {
margin:0 5px;
height: 130px;
width:770px;
background-color: #99CCCC;
}
#top{
clear:both;
margin: 0 auto;
width:770px;
height: 85px;
background-color: Gray;
}
#pathway{
margin-top:2px;
width:750px;
height:15px;
background-color: white;
}
#sliding{
width:750px;
height: 15px;
background-color: yellow;
}
#left-menu{
float:left;
width:150px;
height: auto;
background-colorurple;
margin: 30px 5px;
}
#midle-content {
margin-right:5px;
margin-left:165px;
width:608px;
height:auto;
background-color:#9999CC;
}
#archive{
margin-left:5px;
margin-top:5px;
width:598px;
height:140px;
background-color:yellow;
}
#content-news{
margin-left:5px;
margin-top:5px;
width:598px;
height:auto;
background-color:green;
}
#footer {
clear:both;
margin-left:5px;
margin-top:-50px;
height: 70px;
width: 770px;
background-color: #99CC99;
}

Si une personne genereuse pouvait m'aider ?
Merci
Cordialement

Salut,

Normalement, pour #midle-content
tu vires le "margin-left:165px;", et tu mets, un "float:left;"

Ca résoudra ton problème...
En fait pour mettre deux trucs côte à côte faut faire deux float:left; si on se sert que d'un seul et qu'on fait une marge gauche, ça bug, comme tu as pu le remarquer...
Après je garantie pas qu'il faudra pas rajouter un petit margin-left, pour bien placé le truc...

Mais bon, ça te posera pas de problème...

Slt Merci beaucoup de m'avoir aider comme tu la pu le faire.
Je vais tester en mettant un float:left et je te dirais si ca marche
Et si je met clear:both; ca pourrait marcheR?
Merci
Cordialement

Clear, annule en quelque sorte les float, où veux tu le mettre ??
Y'en a pour le footer ce qui est très bien...
J'ai testé (avec Firebug) ce que je t'ai dit et ça marche...

Re, oui ca marche tres bien par contre j'ai essayer de mettre un margin-top sur mon footer mais ca ne decend tjs pas!
Biare...
http://csource.free.fr

up

Oui c'est bizarre, bah sinon fait un margin-bottom sur #midle-content

Oui mais c'est sur le footer que je voudrais apppliquer
Ps j'ai essayer position:absolute avec top:20px mais ca ne marche pas du tt!
PLz help!

Fait une recherche sur l'attribut CSS display:table-cell

Essayes de :
mettre un float:left; à #footer à la place du clear:both;
et tu dois par contre rajouter un overflow:auto; sur #main-content

Je sais pas pour IE mais ça marche sur Firefox (testé avec Firebug...)

Merci bcp oui en effeet j'ai floater a gauche et ca marche bien on dirait!
Merci par contre overflow: auto ca veut dire koi?

Ca veut dire que si le contenu du div est trop haut ou trop large par rapport à la taille définie, il va afficher des barres de scroll.

bah, presque Omar...

souvent c'est le cas, mais là dans ce cas présent c'est pas le cas..., en fait, et ce qu'avec Firefox, si tu mets pas un overflow:auto; à un div qui contient d'autre div à hauteur variable, le div conteneur ne s'aggrandit pas en fonction des div qu'il contient....

Je sais pas si je suis clair....

sérieux ? Je savais pas ça ! Tu m'apprends quelque chose !

Faut que le div conteneur soit en position absolute alors, non ?