Jquery Show / Скрыть в сафари

Question

Я создал простую панель навигации, которая показывает и скрывает кнопки, используя Jquery .show () и .hide ().Он работает правильно при просмотре в Firefox, но при просмотре в Safari добавляет дополнительные пробелы в панель навигации каждый раз, когда вы скрываете / показываете кнопки.

Вот пример: http://jsfiddle.net/My4d4/

Answer 1

Не используйте display: table и display: table-cell

Похоже, что в Webkit (движке рендеринга, используемом Safari и Chrome) присутствует перерисовка, из-за которой элементы display: table-cell становятсяперекрашен неправильно.Если содержащий div (элемент с display: table скрыт и впоследствии отображается повторно, элементы будут окрашены правильно.

Однако, кажется, что когда элемент display: table-cell скрыт и повторно показанего предыдущая ширина вычисляется обратно в расположение ячеек, а также в текущую ширину, что приводит к странному поведению.

Я бы предложил использовать процентили ширину, float: left и отображение по умолчанию. Если вы хотитеТаблица, используйте таблицу. Если вы хотите избежать таблиц, избегайте таблиц и делайте это правильно.

Пожалуйста, см. мой рабочий пример на jsFiddle