css div centrage

Question

Je suis en train de centrer un bouton div et sa ne fonctionne pas

ici est le css

.game-actions{ 
margin-left:auto; 
margin-right:auto; 
} 

.game-actions a.up { 
    display: block; 
    text-decoration: none; 
    font-weight: bold; 
    padding:12px 32px; 
    float: left; 
    border: 1px solid #c1d9f6; 
    -moz-border-radius: 7px; 
    -webkit-border-radius: 7px; 
} 

.game-actions a:hover { 
    border-color: #80b0ea; 
    background:#e1ecf3; 
} 

ici est le code html

<div class="game-actions"> 
<a class="up" id="a1" href="#" onClick="toggle(this.value)">Tweet it</a> 
</div> 

site Web est à - http://gibberize.com/

Answer 1

Par défaut, les balises div élargissent leur largeur à toute la largeur o f leur conteneur parent. Ainsi, la définition de leurs marges à auto ne fait rien puisqu'elle règle simplement les deux marges à 0. Si vous définissez une largeur fixe pour la div, elle sera centrée.

Answer 2

Par défaut, les éléments div représentent la largeur totale de la page et, puisque vous ne spécifiez pas la largeur, la marge automatique sera de 0 sur les deux côtés.

Dans ce cas, j'utiliserais un text-align: center; sur le div pour centrer le lien.

Answer 3

est ici une solution pour vous. Pour votre première .game-actions classe CSS add:

width:1px; 

aussi, changer la légende Twittez à:

Tweet it 

(pour éviter de casser le bouton sur 2 lignes)