Почему люди делают иконки в кнопках/ссылках используя абсолютное позиционирование?
Никакой практической надобности вопрос не несет конечно) Просто работая с чужим кодом очень часто вижу вот такие вещи и не могу понять почему именно их и почему у всех)
Иконка - декоратор поэтому псевдоэлемент хорошо. Но почему абсолют с паддингом? Это был какой-то менстрим каменного века? При чем часто вертикальная позиция не процент/центрирование а фиксированное смещение
часто ссылок целая куча в навигации, и у всех у них бывают разные иконки, проще просто дополнительный класс задать этой кнопке, что бы отобразить ту иконку которую хочешь, профит в чём:
1 - если кнопке не задать дополнительный класс с иконкой, то её можно переиспользовать где угодно на сайте, если где-то повторяются шрифты например в других каких-то ссылках или кнопках
2 - нет лишних тегов в html для иконок
szQocks, наоборот куда проще, расстояние между иконкой и текстом перестает зависеть от размера иконки и не нужно подгадывать паддинг при каждом изменении размера иконки
imko,
1. Ссылки/кнопки бывают многострочными. При инлайновом псевдо выглядеть это будет странно.
2. Флексы или гриды - хорошо, но имеют НО при наличии внутри текста какого-то тега (span, br). Чтобы гарантированно избежать этого, нужно оборачивать текст в span. <button><span>текст кнопки</span></button>
Итого получаем на чашах весов: абсолют против лишнего тега.
Ankhena, тэг конечно) абсолют потребует еще и всегда подсчитывать паддинг под размер иконки, хорошо еще если его просто так не было чтоб и его досчитывать)
Те что я видел ни разу не были многострочными и более того явно подразумевались как однострочные, так что предельно странная штука
Ankhena, я не против в принципе иконок в абсолютно позиционированных псевдоэлементов, конечно в своих ситуациях они более подходящее решение. Вопрос исключительно про то почему именно в контексте тех случаев что мне вечно попадаются люди не имея по сути оснований для такого решения ситуации люди пользуются именно им)
без абсолюта у тебя положение текста будет зависеть от того, есть иконка или нет. А если она не загрузилась?
Если она не загрузилась, то осталось свободное место. Хоть абсолютом, хоть гридом. (И вообще пропал весь спрайт и сайту стало грустно)
Варианта со сдвигом три: вставлять иконку как img (промолчу), вставлять её как content в псевдоэлемент (а это совсем уж неудобно, потому что плохо регулируются размеры).
Паддинг для того, чтобы иконка была как бы частью элемента, а не находилась отдельно. И такая практика не устарела, до сих пор так делают, но редко. Только вот надобности особой в этом нет
