Sign in to follow this  
alex_web64

Иконка для ссылки

Recommended Posts

https://jsfiddle.net/q2Lfaew5/2/

Пытаюсь добавить иконку к ссылке. Казалось бы, довольно простая задача, но есть несколько условностей, из-за которых пока ничего не получается.

1) Текст должен быть inline-элементом. Для того, чтобы к каждой строке применялась граница, и пустота в них была не кликабельной (как в первом примере).

2) Иконка всегда должна быть вертикально отцентрированная.

Реально ли это сделать?

Share this post


Link to post
Share on other sites

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

https://jsfiddle.net/7tp6fe0m/

Share this post


Link to post
Share on other sites

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

Строк неограниченное количество, иконка должна выравниватся отностельно всех строк, а не первой, не подчеркиватся, но тот уже как получится.

Вот внешне и по поведению идеальный результат https://jsfiddle.net/vde4u218/, но пришлось добавить два тега ссылки, чего хотелось бы избежать.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Member Statistics

    46,436
    Total Members
    3,128
    Most Online
    bauka2288
    Newest Member
    bauka2288
    Joined
  • Recently Browsing   0 members

    No registered users viewing this page.