2014-12-07 3 views
1

У нас есть многоязычный веб-сайт, и, похоже, мы наткнулись на некоторую ошибку, которая присутствует в Chrome/Opera, но не происходит в FireFox/IE. Это происходит только на нескольких наших языках, таких как бенгальский/индуистский/тамильский/урду, и мы считаем, что это либо сценарий, либо шрифт. Кажется, что Chrome/Opera ошибочно вычисляет автоматическую ширину элемента контейнера, и поэтому его дочерний элемент переполняется до следующей строки.Хром/Opera Ошибка отображения CSS на бенгали/индуистском/тамильском/урду (не происходит в FireFox/IE)

Чтобы воссоздать, просто просмотрите главную страницу нашего сайта в Bengali http://colnect.com/bn, используя различные браузеры. У нас нет каких-либо изменений в браузере ни в коде HTML, ни в CSS. Вы можете нажать кнопку «Языки» и переключаться между языками, и вы заметите, что только некоторые из них имеют это. Обходной путь работал на некоторых из этих языков (например, хинди/привет), где мы установили #top_text {font-size: 1em; } вместо 1.1em Играя с CSS, вы могли видеть, что если вы установите ширину ширины для #top_text, кнопка «Языки» не будет перенесена на следующую строку. Однако, если бы его автоматическая ширина была установлена ​​правильно, этого не должно было быть.

Любые идеи для упрощенного обхода CSS, которые все равно оставят наш дизайн отзывчивым и полезным на всех языках?

Благодаря


The languages button is pushed to the next line on Chrome

ответ

1

В вашем CSS (http://s.colnect.net/e-m.036.css)

#lang_btn 

у вас есть display:inline-block;

, если вы измените это

display:inline; 

Или даже удалить это (по умолчанию элемент занимает рядный), этот вопрос будет отсортирован

Второй вариант, чтобы сделать все анкерные элементы рядный блок

т.е. <a></a> в том, что Див, как встроенный блок с white-space: nowrap;

+1

Добро пожаловать, я пробовал искать действительно тяжело, были некоторые ошибки, связанные с тем, что Chrome имел вебкит в качестве своего движка, но не уверен ... по-прежнему ищут :) – skv