Мне нужна помощь в выравнивании кнопок CSS. Я пробовал много разных вариантов, и я просто не могу центрировать свою кнопку так, как хочу.
Во-первых, взгляните на этот URL-адрес: http://www.front-end-developer.net/cssbuttons/example.htm
Я использую 2 изображения для формирования кнопки (это можно сделать на 1 изображении, но в данном случае у нас их два). Все работает так, как ожидалось, пока мы применяем float:left или float:right к родительскому элементу div, чтобы «ограничить» ширину div и закрыть его, как только содержимое div закончится. Вы можете удалить float:left из кнопки, чтобы понять, что я имею в виду.
Но как насчет кнопок, расположенных по центру? Я не могу добавить float:left/right, потому что хочу выровнять его посередине.
Теоретически я мог бы установить
{
width:XXpx;
margin:0 auto;
}
И я получу то, что вы видите на этой картинке:
(источник: front-end-developer.net)
Но я не знаю длину текста внутри. При разных переводах моя кнопка может быть очень короткой или в 5 раз длиннее.
Я также пытался использовать <span> вместо <div>, но, к сожалению, вложенные встроенные элементы не учитывают их правильное заполнение...
И да, я должен использовать <a> внутри, чтобы поисковые роботы могли получить доступ к кнопкам.
Я действительно застрял на этом.
