Div, alignement impossible ?

Impossible d'aligner deux balises deux div !

Sujet résolu

12 mai 2006 à 17:39:40

Bonjour, j'aimerai que vous m'aidiez en effet j'aimerai aligner le block plan et galerie photos :

<lien url="http://img130.imageshack.us/my.php?image=capturefenetreactive14bi.jpg"></lien>

Et voici le morceau du html/php :

Citation : Moi meme | LOL

<div id="nom_photos">Galerie Photos</div>
<div id="photos">Essai</div>
<div id="nom_idplan">Plan</div>
<div id="idplan"><img src="ressources/planmarchelutece.jpg" title="Endroit du Marche de Lutece" alt="Endroit du Marche de Lutece" /></div>
<div id="nom_caracteristiques">Caractéristiques</div>
<div id="caracteristiques">Caractéristiques</div>

Et voici le morceau de css correspondant :

Citation : Idem

#nom_idplan
{
left:150px;
top:309px;
height:25px;
width:250px;
background-image: url(../ressources/fondtitle1.jpg);
text-align:center;
color:white;
margin-top:20px;
margin-left:20px;
}
#idplan
{
left:150px;
top:309px;
height:200px;
width:244px;
text-align:center;
color:black;
margin-left:20px;
border:solid;
border-color:#4085da;
}
#nom_caracteristiques
{
left:150px;
top:309px;
height:25px;
width:250px;
background-image: url(../ressources/fondtitle1.jpg);
text-align:center;
color:white;
margin-top:20px;
margin-left:20px;
}
#caracteristiques
{
left:150px;
top:309px;
width:244px;
text-align:center;
color:black;
margin-left:20px;
border:solid;
border-color:#4085da;
overflow:visible;
}
#nom_photos
{
left:600px;
top:309px;
height:25px;
width:225px;
background-image: url(../ressources/fondtitle1.jpg);
text-align:center;
color:white;
margin-top:20px;
margin-left:300px;
}
#photos
{
top:309px;
width:219px;
text-align:center;
color:black;
margin-left:300px;
border:solid;
border-color:#4085da;
overflow:visible;
}

Merci d'avance!

Anonyme

12 mai 2006 à 18:11:01

Essaie ca:

<div id="contenant">
<div id="nom_photos">Galerie Photos</div>
<div id="photos">Essai</div>
<div id="nom_idplan">Plan</div>
<div id="idplan"><img src="ressources/planmarchelutece.jpg" title="Endroit du Marche de Lutece" alt="Endroit du Marche de Lutece" /></div>
<div id="nom_caracteristiques">Caractéristiques</div>
<div id="caracteristiques">Caractéristiques</div>
</div>

et le css:

#contenant div
{
float: left;
}
#nom_idplan
{
left:150px;
top:309px;
height:25px;
width:250px;
background-image: url(../ressources/fondtitle1.jpg);
text-align:center;
color:white;
margin-top:20px;
margin-left:20px;
}
#idplan
{
left:150px;
top:309px;
height:200px;
width:244px;
text-align:center;
color:black;
margin-left:20px;
border:solid;
border-color:#4085da;
}
#nom_caracteristiques
{
left:150px;
top:309px;
height:25px;
width:250px;
background-image: url(../ressources/fondtitle1.jpg);
text-align:center;
color:white;
margin-top:20px;
margin-left:20px;
}
#caracteristiques
{
left:150px;
top:309px;
width:244px;
text-align:center;
color:black;
margin-left:20px;
border:solid;
border-color:#4085da;
overflow:visible;
}
#nom_photos
{
left:600px;
top:309px;
height:25px;
width:225px;
background-image: url(../ressources/fondtitle1.jpg);
text-align:center;
color:white;
margin-top:20px;
margin-left:300px;
}
#photos
{
top:309px;
width:219px;
text-align:center;
color:black;
margin-left:300px;
border:solid;
border-color:#4085da;
overflow:visible;
}

strucky

12 mai 2006 à 18:15:42

Et au passage, (re)lis ceci