Positionnement de 2 blocs au centre

Résolu/Fermé
Marie-José - 17 janv. 2008 à 23:04
 Marie-José - 19 janv. 2008 à 16:20
Bonsoir,

Dans 2 div j'ai intégré respectivement la propriété float: left; avec deux largeurs différentes : width: 210px: et width: 590px;
L'espace blanc qui se trouve à droite de mon écran, je souhaiterais le centrer en dimension égale à droite et à gauche, pour que les 2 blocs soient centrés au milieu de la page.

Merci
A voir également:

2 réponses

Gihef Messages postés 5150 Date d'inscription mercredi 20 juillet 2005 Statut Contributeur Dernière intervention 20 février 2023 2 775
17 janv. 2008 à 23:43
Bonjour,

Une solution assez simple est de les placer dans un autre bloc que tu centreras.
Comme ça par exemple
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Un titre</title>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <style type="text/css">
    html, body {
      margin: 0;
      padding: 0;
      text-align: center; /* ça --------------------------- */
      background-color: #932600;
      color : #344979;
      }
    #conteneur {
      position: relative;
      margin: 0 auto; /* et ça ---------------------------- */
      width: 800px;
      text-align: left;
      border : 1px solid #fff;
      background-color: #ffd;
      font-family: 'Trebuchet MS', Verdana, sans-serif;
      height : 400px;
      }
    .h {
      color : #ee5641;
      }
    p {
      margin : 1em;
      }
#left1, #left2 {
  float : left;
  background-color : #;
  }
#left1 {
  width : 210px;
  background-color : #b0c4de;
  }
#left2 {
  width : 590px;
  background-color : #ffdab9;
  }
    </style>
</head>
<body>
  <div id="conteneur">
    <p>conteneur</p>
    <div id="left1"><p class="h">left1</p></div>
    <div id="left2"><p class="h">left2</p></div>
  </div>
</body>
</html>

--
1
Gihef,

Un grand merci pour tes infos... très détaillées... centrage parfait !

Marie-José
0