2013-03-29 2 views
-2

Я пытаюсь помочь другу с блогом на wordpress.com http://mpiedgeworldclass.wordpress.com/.Сафари-специфический CSS?

У них есть опция редактирования css, заплаченная за/включен, поэтому мы можем редактировать css, но не можем коснуться самой темы.

Существует вертикальное изображение, повторяющееся между боковой панелью и областью содержимого. Он работает слишком высоко в Safari, но отлично работает в Chrome.

a safari css issue

Если бы я мог получить доступ к теме/html Я думаю, это было бы легко исправить, но при попытке сделать это только с помощью CSS .... Я не уверен, если это один даже возможно ,

У всех мастеров CSS есть идеи?

(я искренне желаю, у меня было больше CSS навыков, но это, кажется, не легко прийти ни через 6 лет очень быстро либо.) :(

+1

Нужно посмотреть код. – j08691

+0

[Условный CSS] (http://www.conditional-css.com/usage) предоставит вам инструменты для использования CSS для конкретной настройки Safari. Что касается этой конкретной проблемы, вам определенно нужно обмениваться кодами. – zajd

+0

попробуйте использовать условный css. –

ответ

1

Все это немного беспорядок, но лучшее решение, которое я могу найти (что не влияет на Chrome), заключается в установке height: 187px; на #header.

Это интересная проблема, когда Safari обрабатывает поля по-разному в зависимости от того, была ли вы определена высота или нет, хотя рассчитанная высота для авто выходит на ту же величину. У меня была аналогичная проблема на днях.

+0

:) Спасибо за предложение. Это определенно немного беспорядок, а не то, как я обычно подходил к делу, если бы у меня был выбор. Иногда принуждение к подобным действиям учит вас чему-то. В любом случае, я установил высоту и, похоже, исправил Safari. Он слегка влияет на Chrome, нажав вертикальное синее изображение (панель) вниз, создав 1 пиксель зазора в Chrome, без пробелов в Safari. Вероятно, это должен быть компромисс, который мы должны сделать подозреваемым. –

+0

Это интересно, это не делает 1px пробел для меня. Другое, что вы можете сделать, это установить позицию: relative; на #header, чтобы сделать его сверху.По-прежнему проблема смещения контента, но тогда вы можете установить высоту 186 пикселей; чтобы избавиться от разрыва. Хакки, но это должно сработать. –

0

Safari and Chrome a оба основаны на WebKit и, как таковые, не имеют неотъемлемых различий, когда дело доходит до рендеринга css. Однако, если ваш браузер Chrome использует другую версию webkit, чем ваши сафари, вы можете увидеть некоторые проблемы. Эта проблема выглядит как проблема с позицией или отображением ... которая, насколько мне известно, действительно изменилась.

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