Подтвердить что ты не робот

Как сделать <div> или <a href= "https://stackoverflow.com/#" rel="nofollow noreferrer" >для выравнивания центра

Я использую следующий код в разделе body.

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

Есть ли альтернатива тегу <center>?

Как я могу сделать его центром без использования тега <center>?

4b9b3361

Ответ 1

Добавить text-align:center;display:block; в классе CSS. Лучше, чем устанавливать стиль на самих элементах управления. Если вы хотите изменить это, вы делаете это в одном месте.

Ответ 2

Вы можете сделать это:

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

Ответ 3

Вы можете использовать css, как показано ниже;

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

Ответ 4

Вы можете ввести параграф

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

Чтобы выровнять div в центре, вам нужно сделать 2 вещи: - Сделайте div фиксированной шириной - Задайте переменную свойств левого и правого полей

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

Ответ 5

Вы можете использовать следующий код:

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

Установив в моем случае ссылку для display:block, проще разместить ссылку.
Это работает одинаково, если вы используете тег/класс <div>.
Вы можете выбрать любую необходимую width.

Ответ 6

Я не знаю почему, но для меня text-align:center; работает только с:

text-align: grid;

ИЛИ ЖЕ

display: inline-grid;

Я проверил, и ни один стиль не переопределяет.

Моя структура:

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

Если кто-нибудь знает, почему display: block; не работает, пожалуйста, прокомментируйте.

Ответ 7

В вашем html файле:

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

В вашем файле css:

.hpbottom{
    text-align: center;
}