28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

je place un élément à droite d'un autre en me servant de la propriété


position:absolute;


et j'observe que mon élément est complètement décallé vers la droite sur IE6.

Voici mon css




.resume_essai01_all
{
width:823px;
height:200px;
margin-top:2px;
background-image: url('../images/deg10.png');
background-repeat:repeat-x;
border-top:1px solid white;
}


.resume_essai01
{
width:558px;
height:200px;
color:white;
font-size:12px;
text-align:left;
margin-left:5px;
background-image: url('../images/deg10.png');
background-repeat:repeat-x;
float:left;
display:inline;
}


.valise_essai01
{
position:absolute;
z-index:2;
width:259px;
height:200px;
margin-left:563px;
font-size:18px;
text-align:center;
background-image: url('../images/valise.png');
}


.vignette
{
position:absolute;
z-index:1;
margin-left:570px;
width:200px;
height:100px;
/*background-image: url('../images/vignette03.jpg');*/
/*float:left;*/
}





ma page en ligne est la suivante :www.swapnfly.fr

et c'est la valise qui est complètement décallée vers la droite...

J'ai bien essayé l'option

position: relative;
zoom: 1;

sur les div resume_essai01 ou encore resume_essai01_all mais ça ne fonctionne pas...

mais ça ne fonctionne pas...
Modifié par samb01 (25 Apr 2011 - 12:24)
Bonjour, dans ton code tu as ceci:


.valise_essai01 { 
position:absolute; 
z-index:2; 
width:259px; 
height:200px; 
margin-left:563px; 
font-size:18px; 
text-align:center; 
background-image: url('../images/valise.png'); 
} 


Pour que ton bloc se positionne par rapport à son parent, tu dois plutôt avoir ceci:

.valise_essai01 
{ 
position:absolute; 
z-index:2; 
width:259px; 
height:200px; 
top: 0;
right: 0; 
font-size:18px; 
text-align:center; 
background-image: url('../images/valise.png'); 
} 


Tu aurais aussi pu mettre ton image directement dans le html au lieu d'un bloc vide ?