Aller au contenu

Chevauchement de div


Oublieuse

Sujets conseillés

J'imagine que le sujet a déjà été traité, mais je ne trouve pas mon bonheur avec la recherche... En fait, c'est simple, je veux juste aligner horizontalement trois div dans un conteneur. Seulement je ne sais pour quelle raison, les div se chevauchent. J'ai pourtant suivi les indications trouvée sur Pompage.net. Voici le code Css concerné:

#page {
background-color: black;
padding: 0.6em;
margin-left: 5em;
margin-top: 5em;
width: 90%;
height: 70%;
-moz-border-radius: 0.8em;
filter: alpha(opacity=90);
-moz-opacity: 0.90;
opacity: 0.90;
}
#gauche {
background-color: orange;
width: 17%;
height: 95%;
float: left;
filter:alpha(opacity=90);
-moz-opacity:0.90;
opacity: 0.90;
padding: 0.6em;
}
.menu {
list-style-type: none;
font-size: 1em;
padding: 0;
margin: 0;
}
#separateur {
width: 5%;
height: 95%;
background-color: green;
float: left;
}
#contenu {
width: 78%;
background-color: orange;
height: 95%;
font-size: 0.8em;
padding: 0.6em;
text-align: justify;
float: left;
filter:alpha(opacity=90);
-moz-opacity:0.90;
opacity: 0.90;
}

Et le code Html:

<div id="page">
<div id="gauche">
<ul class="menu">
<li>Linux ha meziantoù frank</li>
<li>Lennegezh</li>
</ul>
</div>
<div id="separateur">BIdule truc</div>
<div id="contenu">
<h2>Titl</h2>
<p>Blablabla</p>
</div>
</div>

Lien vers le commentaire
Partager sur d’autres sites

Bon après moults essais, ça l'air de provenir des paddings... J'ai ce chevauchement avec les nagigateurs à moteur gecko, sous Linux, mais pas avec opéra (sous linux aussi). Comme j'avais remarqué des différences entre les pages affichées par firefox sous win ou sous Linux, j'aimerais savoir ce que vous vous voyez à cette page: http://giulia.fraboulet.free.fr/Breun_bed/degemer1.php

Les couleurs sont moches, mais c'est justement pour voir tout ce qui se passe.

Lien vers le commentaire
Partager sur d’autres sites

C'est normal... j'ai changé le code, après avoir trouvé une solution, pour que d'une part la hauteur des div ne dépende pas du texte qu'elles contiennent, et d'autres part qu'elles ne se chevauchent pas. Solution ici. Par contre, paraît que ça ne marche pas avec IE. Mon souci c'est que je n'ai pas IE, étant sous Linux. Si l'un d'entre vous pouvait me dire ce qu'il voit sous IE, ça serait chouette. Merci!

Lien vers le commentaire
Partager sur d’autres sites

Oui je fais des modifs... d'ailleurs là ça va mieux. Il me reste cependant un prblème, des espaces entre l'image et le cadre du navigateur, puis un espace entre le bloc de texte et l'image de nuages. Et je ne comprends pas où est le souci, mais on verra ça demain.

Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...