CSS-консистенция CrossBrowser на простой анимации CSS3

Question

У меня проблема с согласованностью CSS здесь: http://www.progettostand.com/ Проверка в верхнем праве социальных иконок, значок правильны на IE (чудо!), Всегда 20 шт. Выкл. С FF и выключенным на странице нагрузки, затем центрировали после первого наведения на Chrome. Конечно, это что-то связанное с: после поведения по левому краю. Я пытался возиться с этим, но ему удалось только переключить проблему между браузерами и никогда не удалось иметь все три работая как предназначенные. Пожалуйста, помогите мне грит.

Спасибо заранее за время и усилия.

Answer 1

Просто быстрое исправление, в настоящее время у меня есть только Chrome для тестирования, поэтому не может действительно поручиться для других браузеров, но, возможно, попробуйте добавить что-то вроде этого в свои стили:

#top-social-bar a{
 text-align:left;
}

#top-social-bar a:before, 
#top-social-bar a:after { 
  text-align: center;
}

.

Answer 2

Сомерные внешние темы не надежны.

Вы должны добавить это в конце вашего style.css:

#top-social-bar{ 
    display:table;
}
#top-social-bar li {
    display: table-cell;
    float: none;
}
#top-social-bar a:before, #top-social-bar a:after{
    width:auto
}

.