28173 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai un container qui contient 3 divs mais ceux ci ne sont pas alignés par rapport au haut de chaque div ce qui donne quelque chose de moche :

upload/12782-apercudiv.JPG

Voici le code du container :

#content .mainContent {
position:relative;min-width:840px;
}


Voici le code des 3 divs :

#leftColumn {
width:30%;
position:absolute;
left:0px;
top:0px;
border:1px solid #dcdadb;
margin-top:40px;
background-color:white;
padding:0 10px 10px 10px
}
#rightColumn {
width:30%;
position:absolute;
right:0px;
top:0px;
border:1px solid #dcdadb;
margin-top:40px;
background-color:white;
padding:0 10px 10px 10px
}
#middleColumn {
width:30%;
display: block; 
margin: 0 auto 0;
border:1px solid #dcdadb;
background-color:white;
padding:0 10px 10px 10px
}


Il a très certainement quelque chose que j'ai oublié...

Merci d'avance
Modifié par thomus38 (14 Jun 2007 - 10:38)
Bonjour,

Il y a sûrement dans tes blocs, ou un hn ou un p avec un margin ou padding;
initialise les à 0 pour voir...
salut thomus

tu as une marge haute


#leftColumn {
margin-top:40px;
}


pour les deux éléments en position absolute
alors que tu n'en a pas pas pour ton élément block

je ne suis pas sûr d'ailleurs que le display block soit très utile

j'essaierais comme ceci


#leftColumn {
	width:30%;
	position:absolute;
	left:0px;
	top:0px;
	border:1px solid #dcdadb;
	margin: 0;  /* modif */
	background-color:white;
	padding:0 10px 10px 10px
}

#rightColumn {
	width:30%;
	position:absolute;
	right:0px;
	top:0px;
	border:1px solid #dcdadb;
	margin: 0;  /* modif */
	background-color:white;
	padding:0 10px 10px 10px;
}

#middleColumn {
	width:30%;
	margin: 0 auto; /* modif */
	border:1px solid #dcdadb;
	background-color:white;
	padding:0 10px 10px 10px
}


bon courage

a++

Modifié par deepo (14 Jun 2007 - 07:38)
Effectivement; c'était bien une erreur de marge. J'ai honte....

Quoi qu'il en soit, merci grandement pour votre aide.

A bientot