28172 sujets

CSS et mise en forme, CSS3

Bonjour,
voici mon problème, peut-être très simple...
Je cherche à centrer un div de 960 px, encadré de deux div prenant chacun ce qu'il reste en place.
DIV 1 | DIV CENTRE | DIV 2

Mon css ressemble à ceci:

#div1{
float: left;
}

#centre{
float:left;
width: 960px;
}

#div2{
float:left;
}


Mais bien évidemment si je ne spécifie pas de largeur à mon premier div, le div à centrer se colle directement à gauche. Je ne vois pas comment régler cela en CSS.

Merci d'avance pour votre aide.
Modifié par KzrData (02 Mar 2011 - 11:53)
À vue de nez c'est une mauvaise stratégie de positionnement.
Donc même question que Laurie-Anne.
En fait, il s'agit d'une bannière contenue dans le div Centre pour laquelle une ligne basse va du bleu vers le faire. Je voudrais donc la prolonger en bleu dans le div de gauche et en vert dans le div de droite.
Donc j'ai juste un background en CSS.
Ce n'est peut-être pas la solution idéale mais si vous avez d'autres idées, je suis preneur.

Merci
Modifié par KzrData (02 Mar 2011 - 09:38)
C'est bien ce que je pensais.

Oublies tes divs sur les côtés, et utilises une seule image de fond, centrée pour ton bloc de contenu (ou le bloc qui le contient).

en gros :
<div id="warp">
[...]
<div id="centre"></div>
[...]
</div>


#warp{
  background-image: url(...);
  background-position: center;
  background-repeat:...;
}
#centre{
  margin:0 auto;
  width:960px;
}
Effectivement, c'était tout bête...
Je n'avais pas pensé à la propriété background-position.
Merci