Вече двама души ми съобщиха, че под браузъри 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 не.
Това са особености на браузърите, с които трябва да се съобразяваш, когато поставяш дълъг низ на място с ограничена ширина.
Брой разглеждания на тази статия: 621
Сподели статията в
Тези бутончета са връзки към сайтове, в които можете да качите линк към тази страница.
