изображение теряется при использовании ems для изменения размера

Question

Я столкнулся с проблемой с моим шаблоном, которая кажется мне странной: когда я использую ems для определения высоты / ширины изображения, он не будет отображаться, в то время как настройка размера изображения с использованием пикселей работает нормально. Использование ems для определения отступов и полей также не имеет никакого эффекта. Просмотр страницы источника показывает, что изображение там; Это похоже на то, что браузер отображает любое значение как 0em для изображений. Интересно, что поля и отступы для других элементов (h2 p) с помощью ems работают. Я провел довольно много тестов, чтобы сузить проблему до модуля em, хотя я не уверен.

Это происходит независимо от того, вставляю я CSS или в связанные таблицы стилей. Это происходит в IE и Firefox. Я использую систему управления контентом (Joomla), и когда я переключаюсь на другой шаблон, настройка размера изображения с помощью EMS работает нормально.

Существуют ли какие-либо известные конфликты в CSS или где-либо еще, из-за которых изображение исчезает, когда его размер определяется ems?

Answer 1

Поскольку вы используете Joomla и сказали, что проблема решается при смене шаблона, я почти уверен, что именно стили шаблона не позволяют использовать em s.

Если вы используете Firefox или Chrome, вы можете проверить исходный код с помощью firebug (http://getfirebug.com/ -> щелчок правой кнопкой мыши, элемент Inspect), чтобы увидеть, какие стили применяются к изображениям / полям /обивка.

Если вы не хотите изменять стили шаблона, вы можете добавить правило !important (только если вы не хотите трогать исходные файлы) в строках ширины и высоты.Правило, которое имеет свойство! Важное, всегда будет применяться независимо от того, где это правило появляется в документе CSS.Удачи!