Бъг в IE8 и Google Chrome

IE8 bugВече двама души ми съобщиха, че под браузъри 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 и промених тази част, която показва връзките.

Заместих реда:

echo "<li><a href="{$http_link}">{$row->link}</a></li>";

със следния код:

$link_text = $row->link;
$link_text = preg_replace('|/|','/ ',$link_text);
if(mb_strlen($link_text)>25) $link_text = mb_substr($link_text,0,25).'...';
echo "<li><a href="{$http_link}">{$link_text}</a></li>";

Това ще доведе до пренасяне на нов ред на връзките след знака / ако не се събере в колоната. Текста на връзката става на повече от един ред, като адреса на линка остава непроменен. За всеки случай добавих и съкращаване на връзките до 25 сивмола, защото освен знака / е възможно да има и други знаци интерпретирани като букви.

Пробвах дали има проблем с други знаци:
не се пренасят на нов ред _ , . @ & ? + = ; пренася се на нов ред това важи за всички браузъри.
Знаците / \ се обработват различно в различните браузъри – IE8 и Chrome не ги пренасят, Firefox – да.
Интересно е че със знака ! е обратно – при IE8 низа се пренася, а при Firefox и Chrome не.

Това са особености на браузърите, с които трябва да се съобразяваш, когато поставяш дълъг низ на място с ограничена ширина.

Прочетена:6748
« Предишна публикация

PHP strlen() и текстове на кирилица

Проблем Вече в няколко сайта уеб директории, забелязвам следния проблем: в уеб формата за качване на сайт полетата имат ограничение в броя на символите, което е нормално, но е проблем, когато пише, че може да въведеш ... Повече информация »

Следваща публикация »

Логване в сайт с OpenID през Google

Ограничен достъп и логване с OpenID Някой от страниците на сайта ganbox.com реших да са достъпни само след логване, затова ми се наложи да си направя логин форма, през която потребителите да се логват и да ... Повече информация »

4 коментара

  1. pavel 29.01.2010
  2. teodor 28.02.2010
  3. ilko 23.01.2013
споделиха