Ошибка в IE8 и Google Chrome | ВесьТоп создание и продвижение сайтов

Поддержка сайта

Высокие позиции в поисковой системе, на прямую зависят от развития вашего сайта.

Продвижение сайтов

Эффективность стратегий продвижения подтверждается сотрудничеством с крупными клиентами и отзывами о нашей работе.

Создание сайтов

Мы делаем сайты быстро, недорого и профессионально. От работы с нами, у вас останутся только положительные эмоции.

Ошибка в IE8 и Google Chrome

Ошибка в IE8 и Google Chrome

Два человека уже сказали мне, что в Google Chrome и Internet Explorer 8 мой блог отображается неправильно и два столбца справа смещаются.

Я проверил, и действительно в этих браузерах текст из среднего столбца перешел в правый столбец и сдвинул все его содержимое за пределы столбца (см. Рисунок).

В общем, код на моей странице был действительным XHTML, поэтому я подумал, что это изменение интерпретации CSS в этих новых браузерах. Я просмотрел элементы страницы. Два столбца справа включены в два столбца таблицы HTML. Потратив много времени на просмотр файла CSS, я вспомнил, что нужно проверить, какая из строк самая длинная в среднем столбце, не содержащем пробелов, и оказалось, что это «sites.google.com/site/zabolekarvsofia» (обозначено красной стрелкой на картинке). Тут мне пришло в голову, что если браузер воспринимает эту строку как отдельное слово, нормально не переносить ее на новую строку. Я сразу же проверил, поставив пробел после знака «/», и поэтому нашел это простым, но трудным для поиска:

Проблема:

Internet Explorer 8 и Google Chrome неверно интерпретируют символ / как букву, в результате чего длинные строки URL-адресов не перемещаются на новую строку и не перемещают текст на странице.

Ответ:

В моем случае мне пришлось либо переместить строку, либо сократить ее до 25 символов, чтобы она поместилась в столбце, при этом оставив ссылку на страницу, на которой было оплачено SMS-объявление, неизменной. Я нашел код для плагина SMS-рекламы в каталоге / wp-content / plugins и изменил эту часть, которая показывает ссылки.

Заменил строчки:

lt; p style ="маржа: 0,0 пикселей 0,0 пикселей 0,0 пикселей 0,0 пикселей; шрифт: 13.0px Monaco; цвет: # c03030; цвет фона: # f1f1f1"gt; lt; span style ="шрифт-кернинг: нет; цвет: # 2060a0"gt; echolt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28"gt; lt; / spangt; lt; span style ="шрифт-кернинг: нет"gt;"< li>< a href ="lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28"gt; {lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # a08000"gt; $ http_linklt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28"gt;} lt; / spangt; lt; span style ="шрифт-кернинг: нет"gt;"> {$ row-> ссылка}< / а>< / li>"lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28"gt ;; lt; / spangt; lt; / pgt; lt; p style ="маржа: 0,0 пикселей 0,0 пикселей 0,0 пикселей 0,0 пикселей; высота строки: 14,0 пикселей; шрифт: 12.0px Times; цвет: # 000000"gt; lt; span style ="шрифт-кернинг: нет"gt;

со следующим кодом:

lt; p style ="маржа: 0,0 пикселей 0,0 пикселей 0,0 пикселей 0,0 пикселей; шрифт: 13.0px Monaco; цвет: # a08000"gt; lt; span style ="шрифт-кернинг: нет; цвет фона: # f1f1f1"gt; $ link_textlt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28; цвет фона: # f1f1f1"gt; знак равно lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет фона: # f1f1f1"gt; $ rowlt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28; цвет фона: # f1f1f1"gt; -> lt; a href ="http://www.php.net/link"gt; lt; span style ="шрифт-кернинг: нет; цвет: # 008080"gt; linklt; / spangt; lt; / agt ;; lt; / spangt; lt; / pgt; lt; p стиль ="маржа: 0,0 пикселей 0,0 пикселей 0,0 пикселей 0,0 пикселей; шрифт: 13.0px Monaco; цвет: # a08000"gt; lt; span style ="шрифт-кернинг: нет; цвет фона: # f1f1f1"gt; $ link_textlt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28; цвет фона: # f1f1f1"gt; знак равно lt; a href ="http://www.php.net/preg_replace"gt; lt; span style ="шрифт-кернинг: нет; цвет: # 008080"gt; preg_replacelt; / spangt; lt; / agt; (lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # c03030; цвет фона: # f1f1f1"gt; ‘| / |’ lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28; цвет фона: # f1f1f1"gt ;, lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # c03030; цвет фона: # f1f1f1"gt; ‘/’ lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28; цвет фона: # f1f1f1"gt ;, lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет фона: # f1f1f1"gt; $ link_textlt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28; цвет фона: # f1f1f1"gt;); lt; / spangt; lt; / pgt; lt; p style ="маржа: 0,0 пикселей 0,0 пикселей 0,0 пикселей 0,0 пикселей; шрифт: 13.0px Monaco; цвет: # a08000"gt; lt; span style ="шрифт-кернинг: нет; цвет: # 2060a0; цвет фона: # f1f1f1"gt; iflt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28; цвет фона: # f1f1f1"gt; (lt; a href ="http://www.php.net/mb_strlen"gt; lt; span style ="шрифт-кернинг: нет; цвет: # 008080"gt; mb_strlenlt; / spangt; lt; / agt; (lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет фона: # f1f1f1"gt; $ link_textlt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28; цвет фона: # f1f1f1"gt;)> lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 0080a0; цвет фона: # f1f1f1"gt; 25lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28; цвет фона: # f1f1f1"gt;) lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет фона: # f1f1f1"gt; $ link_textlt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28; цвет фона: # f1f1f1"gt; знак равно lt; a href ="http://www.php.net/mb_substr"gt; lt; span style ="шрифт-кернинг: нет; цвет: # 008080"gt; mb_substrlt; / spangt; lt; / agt; (lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет фона: # f1f1f1"gt; $ link_textlt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28; цвет фона: # f1f1f1"gt ;, lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 0080a0; цвет фона: # f1f1f1"gt; 0lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28; цвет фона: # f1f1f1"gt ;, lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 0080a0; цвет фона: # f1f1f1"gt; 25lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28; цвет фона: # f1f1f1"gt;). lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # c03030; цвет фона: # f1f1f1"gt; ‘…’ lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28; цвет фона: # f1f1f1"gt ;; lt; / spangt; lt; / pgt; lt; p style ="маржа: 0,0 пикселей 0,0 пикселей 0,0 пикселей 0,0 пикселей; шрифт: 13.0px Monaco; цвет: # c03030; цвет фона: # f1f1f1"gt; lt; span style ="шрифт-кернинг: нет; цвет: # 2060a0"gt; echolt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28"gt; lt; / spangt; lt; span style ="шрифт-кернинг: нет"gt;"< li>< a href ="lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28"gt; {lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # a08000"gt; $ http_linklt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28"gt;} lt; / spangt; lt; span style ="шрифт-кернинг: нет"gt;"> {$ link_text}< / а>< / li>"lt; / spangt; lt; span style ="шрифт-кернинг: нет; цвет: # 2b2c28"gt ;; lt; / spangt; lt; / pgt; lt; p стиль ="маржа: 0,0 пикселей 0,0 пикселей 0,0 пикселей 0,0 пикселей; высота строки: 14,0 пикселей; шрифт: 12.0px Times; цвет: # 000000"gt; lt; span style ="шрифт-кернинг: нет"gt;

Это переместит новую строку ссылок после символа /, если она не помещается в столбце. Текст ссылки занимает более одной строки, а адрес ссылки остается неизменным. На всякий случай я добавил сокращение ссылок до 25 символов, потому что помимо символа / можно интерпретировать другие символы как буквы.

Я попытался проверить, нет ли проблемы с другими персонажами:

не переносятся на новую строку _ ,. @ & ? + =; переходит на новую строку — это относится ко всем браузерам.

Символы / \ обрабатываются по-разному в разных браузерах — IE8 и Chrome не поддерживают их, Firefox поддерживает.

Интересно, что со знаком! наоборот — в IE8 строка портирована, а в Firefox и Chrome — нет.

Это особенности браузеров, которые необходимо учитывать при размещении длинной строки в месте с ограниченной шириной.

Читайте так же:
Not found

Нам доверяют

Интернет магазин