Problème de positionnement CSS

doomer2 · 9 Octobre 2004

Bonjour,

Excusez moi, je crois que je me suis trompé en mettant mon msg dans la rubrique accessibilité.

Je suis novice en css et j'essaie d'assembler 4 images pour ne former que mon image final. Je réussis à le faire mais lorsque je redimensionne mon image toutes les images se mettent les unes en dessosu des autres.

Je vous donne mon source xhtml:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="accueil.css" rel="stylesheet" type="text/css" />
</head>

<body>
<dic class="conteneur">
<div class="bloc1"></div>
<div class="bloc2"></div>
<div class="bloc3"></div>
<div class="bloc4"></div>
</div>
</body>
</html>

Puis mon source css:
.conteneur {
background-color: white;
height: 600px;
width: 800px;
}
.bloc1 {
background-image:url(images/hautg.jpg);
background-attachment: inherit;
height: 225px;
width: 400px;
float:left;
margin-left: 15px;
margin-top: auto;;
}
.bloc2 {
background-image:url(images/hautd.jpg);
background-attachment:inherit;
height: 225px;
width: 400px;
float:left;
margin-left: 0px;
margin-top: auto;

}
.bloc3 {
background-image:url(images/basg.jpg);
background-attachment:inherit;
height:225px;
width: 400px;
float:left;
margin-left: 15px;
margin-top: auto;;
}

.bloc4 {
background-image:url(images/basd.jpg);
background-attachment:inherit;
height: 225px;
width: 400px;
float:left;
margin-left: 0px;
margin-top: auto;;
}

Si quelq'un à une idée afin que mes 4 images restent fixes avec le redimensionnement et comment rajouter un bloc fixe pour ajouter des liens par rapport à mon image assemblée ?

Merci à tous, j'attends vos réponses et surtout de l'aide

Raphael · 9 Octobre 2004

Je pense que ta première erreur est d'avoir découpé l'image en 4. C'est le raisonnement classique des tableaux et non des CSS.

http://www.alsacreations.com/blog/index.ph...otiques-des-css

Sinon pour placer un bloc fixe au-dessus de ton ou tes images, il faut un positionnement + z-index

Modifié 9 Octobre 2004 par Sibelius

Connexion

Problème de positionnement CSS

Sujets conseillés

doomer2

Lien vers le commentaire

Partager sur d’autres sites

Raphael

Lien vers le commentaire

Partager sur d’autres sites

Veuillez vous connecter pour commenter

Parcourir

Activité