web-dev-qa-db-fra.com

Comment créer un <div> ou <a href="#"> aligner le centre

J'utilise le code suivant dans la section body.

<center><a href="contact.html" class="button large hpbottom">Get Started</a></center>

Existe-t-il une alternative pour la balise <center>?

Comment puis-je le centrer sans utiliser la balise <center>?

center
11
Gilchrist Adam

Ajoutez text-align:center;display:block; à la classe css. Mieux que de définir un style sur les contrôles eux-mêmes. Si vous voulez le changer, vous le faites au même endroit.

13
Fred

Tu peux le faire:

<div style="text-align: center">
    <a href="contact.html" class="button large hpbottom">Get Started</a>
</div>
9
Misha Zaslavsky

Vous pouvez mettre dans un paragraphe

<p style="text-align:center;"><a href="contact.html" class="button large hpbottom">Get Started</a></p>

Pour aligner une div au centre, vous devez procéder de deux manières:

<div class="container">
 <div style="width:100px; margin:0 auto;">
     <span>a centered div</span>
  </div>
</div>
1
pazcal

Vous pouvez utiliser css comme ci-dessous;

 <a href="contact.html" style="margin:auto; text-align:center; display:block;" class="button large hpbottom">Get Started</a>
1
Bahattin Ungormus

Vous pouvez utiliser le code ci-dessous:

a {
display: block;
width: 113px;
margin: auto; 
}

En définissant, dans mon cas, le lien vers display:block, il est plus facile. De placer le lien.
Cela fonctionne de la même manière lorsque vous utilisez un tag/classe <div>.
Vous pouvez choisir la width que vous voulez.

0
Thomas

Je ne sais pas pourquoi mais pour moitext-align:center;ne fonctionne qu'avec:

text-align: grid;

OR

display: inline-grid;

J'ai vérifié et aucun style ne prévaut.

Ma structure:

<ul>
    <li>
        <a>ElementToCenter</a>
    </li>
</ul>

Si quelqu'un sait pourquoi display: block; ne fonctionne pas, veuillez commenter.

0
ℛɑƒæĿ