text-align:center ne fonctionne pas avec les éléments div

J'ai cherché pendant environ 45 minutes et je ne pouvais pas trouver une solution à mon problème ici. Je veux ma galerie de classe divs (ceux-ci seront créés dynamiquement) pour aligner eux-mêmes, dans le centre de la gallery_container div en utilisant uniquement des règles css. Je suis en apprentissage donc toute explication serait utile!

Merci d'avance!

<head>
    <style>
    #gallery_container{
        text-align: center; 
        width:100%;
        overflow: auto; 
        background:orange;  
    }
    .gallery{
        text-align: left;   
        border-style: solid;
        border-width:3px;
        border-top-left-radius: 40px;
        border-bottom-right-radius: 40px; 
        background:yellow;
        width:335px;
        padding:20px;
        float:left;
        margin:15px;
    }
    .gallery h2{
        margin-top:0;
    }
    .gallery img{
        height:120px;
        width:160px;
        float:right;
    }
</style>

<body>
    <div id ='content_gallery'>
        <h2>Gallery</h2>

        <div id='gallery_container'>
            <div class = gallery>
                <img src = 'bowling_01.png'>
                <h2>Company bowling</h2>
                <h4>Date: June 14, 2013</h4>
                <p>The company heads to Boca Bowl for our monthly bowling event!</p>
            </div>

            <div class = gallery>
                <img src = 'bowling_01.png'>
                <h2>Company bowling</h2>
                <h4>Date: June 14, 2013</h4>
                <p>The company heads to Boca Bowl for our monthly bowling event!</p>
            </div>

            <div class = gallery>
                <img src = 'bowling_01.png'>
                <h2>Company bowling</h2>
                <h4>Date: June 14, 2013</h4>
                <p>The company heads to Boca Bowl for our monthly bowling event!</p>
            </div>
        </div>
    </div>
</body>

et ici le violon http://jsfiddle.net/9gwKc/1/

Votre problème est que vous avez marqué l' .galerie de classe css avec display: inline;. Comment vous attendez-vous à de centre d'aligner les éléments que vous avez dit au navigateur à empiler les unes à côté des autres?
Je vois, j'ai quitté ce code n'partir de quand j'ai été le tester. Lors de sa suppression, je ne vois pas la différence.
<div class = gallery> ne fonctionne, vous devez <div class="galerie">, et la balise img devrait ressembler à ceci <img src="pixs.png" alt="" /> peut-être que cela aide un peu jsfiddle.net/9gwKc/2
Je n'ai pas le même avis, j'ai oublié les guillemets! mais ça marche comme ça dans google chrome (ou autre, je l'aurais pris). Merci pour la réponse! Il n'aide pas à ma question 🙁

OriginalL'auteur Doctor Parameter | 2013-06-18