Изменить 2: Мое время короткое, поэтому я буду использовать предложение Dippas об использовании фактического изображения вместо фона. Я держу этот вопрос открытым, если у кого-то есть лучшее решение. Спасибо вам за помощь!
Оригинальный вопрос/проблема:
Я был Google Googling для решения в течение часа, безрезультатно!
Я форматирую сайт, чтобы реагировать, и несколько длинных ссылок, которые содержат фоновое изображение, не ломаются правильно. Я пробовал float: left, display: block, display: inline-block, и никто из них не работает. Самое близкое, что я получил к исправлению, это его отображение: inline, но я предпочел бы, чтобы фоновое изображение было сбоку, а не рядом с последним словом.
Это мой первый случай, когда я лично консультирую этот сайт (я использовал ваши решения, чтобы выходить из колеи много раз раньше, так что спасибо!), поэтому я не могу отправлять изображения, но здесь пример грубой скрипки ( Изменить: здесь новая скрипка, так как у другой была определенная ширина div):
http://jsfiddle.net/2e28fanq/22/
(Я хочу избавиться от этого дополнительного пространства между стрелкой и "Образовательным" )
CSS
a {
display: block;
float: left;
width: auto;
font-size: 1.5em;
padding-right: 40px;
background: url('Arrow-Right.png') 100% 50% no-repeat;
}
Вот грубая иллюстрация того, что мне нужно:
Register for a FREE Educational >
Webinar
И что он делает вместо этого:
Register for a FREE Educational >
Webinar
Увидев, как это происходит в JSFiddle, я тоже сомневаюсь, что это имеет какое-то отношение к остальной части моего кода. Я не могу ссылаться на рассматриваемый сайт из-за конфиденциальности/условий контракта, но я надеюсь, что кто-то здесь может помочь мне с тем, что я могу предоставить. Спасибо!
