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

Как центрировать элемент привязки в CSS?

Я просто хочу, чтобы мой якорь находился в середине экрана по горизонтали, как я могу это сделать?

<a href="#" onclick="location.href='http://www.example.com'; return false;">example</a>
4b9b3361

Ответ 1

Добавьте свойство text-align css в его атрибут родительского стиля

Например:

<div style="text-align:center">
  <a href="http://www.example.com">example</a>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
</div>​

Или используя класс (рекомендуется)

<div class="my-class">
  <a href="http://www.example.com">example</a>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
</div>​
.my-class {
  text-align: center;
}

См. ниже рабочий пример:

.my-class {
      text-align: center;
	  background:green;
	  width:400px;
	  padding:15px; }
	.my-class a{text-decoration:none; color:#fff;}
<!--EXAMPLE-ONE-->
	<div style="text-align:center; border:solid 1px #000; padding:15px;">
      <a href="http://www.example.com">example</a>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
    </div>​

	<!--EXAMPLE-TWO-->
	<div class="my-class">
      <a href="http://www.example.com">example</a>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
    </div>​

Ответ 2

пишите вот так:

<div class="parent">
 <a href="http://www.example.com">example</a>
</div>

CSS

.parent{
  text-align:center
}

Ответ 3

Два варианта, которые имеют разные применения:

HTML:

<a class="example" href="http://www.example.com">example</a>

CSS

.example { text-align: center; }

Или:

.example { display:block; width:100px; margin:0 auto;}

Ответ 4

попробуйте обернуть div и добавить эти стили в div:

 width: 100%; 
 text-align:center;

Ответ 5

<span style="text-align:center; display:block;">
<a href="http://news.awaissoft.com">Awaissoft</a>
</span>

Ответ 6

По умолчанию якорь визуализируется встроенным, поэтому установите text-align: center; на его ближайшего предка, который отображает как блок.

Ответ 7

Существует много способов.

<!-- Probably the most common: -->
<div style="text-align: center;"><a href="...">Link</a></div>

<!-- Getting crafty... -->
<a href="..." style="display: block; text-align: center;">Link</a></div>

Возможно, есть и другие способы, но эти три, вероятно, являются наиболее распространенными.

Ответ 8

Try

margin: 0 auto;
display:table

Надеюсь, что кто-то поможет.

Ответ 9

Вы можете попробовать этот код:

/**code starts here**/

a.class_name { display : block;text-align : center; }

Ответ 10

style="margin:0 auto; width:auto;" Попробуйте это.

Ответ 11

Я думаю, вы не можете сделать это с помощью встроенных элементов, таких как anchor, span. Но чтобы заставить его работать, вы должны настроить отображение блокировки.

<a href="http://www.example.com" style="text-align:center;display:block;">example</a>

Ответ 12

css не может применяться непосредственно для выравнивания метки привязки. Css (text-align: center;) следует применить к родительскому элементу div/, чтобы эффект выравнивания выполнялся на теге привязки.

Ответ 13

Просто поставьте его между центральными тегами:

<center>><Your text here>></center>