CSS фоновое изображение повторяется при наведении курсора на тег привязки

Question

У меня проблема с этим конкретно на macs, и совсем недавно у меня была проблема с более жирным шрифтом только с macs, но это было исправлено с помощью CSS.

Проблема: У меня есть 10 привязанных тегов в абсолютном положении, и при наведении курсора (зеленый фон-изображение) не возникает проблем с перекрытием на ПК, но на Mac почти во всех браузерах, фоновое изображение немного накладывается на следующее предложение.

CSS для выше (наведите курсор):

.homeText a:hover {

    background-image: url('/cont-img/on-hover-span_background-partial-solid.jpg');
    color: White;
    cursor: pointer;
    background-position: center;
    background-repeat:repeat;
    margin-right:-5px;
    font-style: italic;
}

Абсолютное позиционирование CSS каждого элемента имеет много места между предложениями, так что это не проблема. Кроме того, период в конце представляет собой спрайт из 2 разных изображений, белый период при наведении и серый период при наведении. Для этого я добавляю класс css к тегу span в конце тега привязки, который устанавливает положение фона для спрайта в теге span.

Есть мысли?

Answer 1

Я считаю, что это просто проблема со шрифтом.Когда я захожу на ваш сайт в Linux, между ссылками остается гораздо больше места, чем в Windows.

Кстати, может быть, немного не по теме, но ваш сайт не очень хорошо обрабатывает небелые цвета фона,Возможно, вы захотите установить цвет фона самостоятельно, а не полагаться на настройки пользователя по умолчанию.

Answer 2

убедитесь, что у вас есть padding:0; margin:0; и убедитесь, что <a> не содержит пробелов или чего-то еще после точки.Кроме того, почему вы используете фоновое изображение?Разве вы не можете просто установить background-color:green? ..., который вы, возможно, захотите попробовать, просто чтобы увидеть, не отличается ли он.

Answer 3

Поскольку у меня есть тег span внутри каждого якоря, я понял, что с помощью Timmerz мне пришлось удалять отступы и margin-right из каждого случая.Наиболее существенная причина, по которой я получаю больше перекрытия фоновых изображений, чем ожидалось, заключается в том, что ширина диапазона была неоправданно большой для количества пикселей, которое занимает только период, создавая больше места для перекрытия.

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

Спасибо за вклад каждого.