Centrer du contenu dans 3 div différentes

Résolu
Bonjour,

Pouvez m'aider à centrer 3 div dans une div comme l'image ci-dessous svp ?


Merci

4 réponses

  1. slt

    pour t'aider il faut que tu nous donnes ce que tu as déjà fais, sinon c'est pas de l'aide, c'est te le faire !
    1. Merci pour votre réponse :)

      en fait j'ai 3 div que je veux mettre dans une div qui les englobe comme sur l'image

      <div id=" englobe">

      <div id=" contenu-1"> texte et image centrer </div>
      <div id=" contenu-2"> texte et image centrer </div>
      <div id=" contenu-3"> texte et image centrer </div>
      <div id=" contenu-4"> texte et image centrer </div>

      </div>

      En CSS :
      #englobe{}
      #contenu-1 { je ne sais pas comment faire pour arriver au résultat de l'image }
      #contenu-2{ je ne sais pas comment faire pour arriver au résultat de l'image }
      #contenu-3 { je ne sais pas comment faire pour arriver au résultat de l'image }
      #contenu-4 { je ne sais pas comment faire pour arriver au résultat de l'image }

      1. <style type="text/css">
        #global {
        width: 600px;
        height:300px;
        }
        #div1 {
        display: inline;
        float: left;
        height: 170px;
        width: 200px;
        background-color: #F0F0F0;
        border-right-width: 3px;
        border-right-style: solid;
        border-right-color: #09F;
        }
        #div2 {
        display: inline;
        float: left;
        height: 170px;
        width: 200px;
        background-color:#F0F0F0;
        border-right-width: 3px;
        border-right-style: solid;
        border-right-color: #09F;

        }
        #div3 {
        display: inline;
        float: left;
        height: 170px;
        width: 200px;
        background-color:#F0F0F0;

        }
        #div4 {
        display: inline;
        float: left;
        height: 130px;
        width: 200px;
        background-color: #F0F0F0;
        text-align: center;
        border-right-width: 3px;
        border-right-style: solid;
        border-right-color: #09F;

        }
        #div5 {
        display: inline;
        float: left;
        height: 130px;
        width: 200px;
        background-color: #F0F0F0;
        text-align: center;
        border-right-width: 3px;
        border-right-style: solid;
        border-right-color: #09F;

        }
        #div6 {
        display: inline;
        float: left;
        height: 130px;
        width: 200px;
        background-color: #F0F0F0;
        text-align: center;

        }
        h1 {
        font-size: 14px;
        font-family: "Courier New", Courier, monospace;
        }
        .p12 {
        font-family: "Courier New", Courier, monospace;
        font-size: 12px;
        }

        </style>

        <div id="global">
        <div id="div1"></div>
        <div id="div2"></div>
        <div id="div3"></div>
        <div class="clearFloat"></div>
        <div id="div4">
        <h1>Un titre</h1>
        <p><span class="p12">Une petite description centré</span><br />
        </p>
        </div>
        <div id="div5">
        <h1>Un titre</h1>
        <p class="p12">Une petite
        description centré</p>
        </div>
        <div id="div6">
        <h1>Un titre</h1>
        <p class="p12">Une petite description centré</p>
        </div>
        <div class="clearFloat"></div>
        </div>