Очень странная проблема с CSS в Internet Explorer.Я понятия не имею, что не так![закрыто]
-
23-08-2019 - |
Вопрос
Я только что тестировал веб-сайт, созданный в Internet Explorer.Конечно, в Firefox работает нормально.У меня есть набор таблиц стилей, большинство из которых имеют фоновое изображение. Пользователь может выбирать различные таблицы стилей по своему усмотрению.Таблицы стилей отображаются одинаково, за исключением цветов и фона; конечно, текстовая версия отображается по-другому.В любом случае у меня также есть средство изменения размера шрифта, чтобы пользователи могли выбрать наиболее подходящий для них размер шрифта.У меня есть 4 настройки: маленький, стандартный, большой и Xlarge. Когда я загружаю большой и размер шрифта xlarge, фоновое изображение достигает конца моего div, и это нормально.Однако когда я использую мелкий и стандартный размер шрифта, фоновое изображение покрывает только около 5% того, что должно.Возможно, фотографии ниже помогут вам разобраться в моей проблеме.
Ура КХЛ
P.s. Fontsize CSS содержит только размеры шрифтов для классов и идентификаторов, а не стиль фона.
Проблема:http://www.webquark.co.uk/project/problem.bmp
Работаем над большим размером шрифта:http://www.webquark.co.uk/project/working.bmp
Как это выглядит в работе Firefox:http://www.webquark.co.uk/project/firefox.bmp
Вот мой CSS, который устанавливает фон:
.content{
background-image: url(springBG.jpg);/**Change for season**/
background-attachment:fixed;
background-position:top center;
background-repeat:no-repeat;
font-family: Calibri, Ariel, sans-serif;
}
Решение 8
Привет, я нашел проблему, мне нужно было установить высоту div.Для тех, кто упомянул об этом, я добавил балл в вашу репутацию и спасибо за совет :D
КХЛ
CSS:
height:100%;
Другие советы
В объявлении CSS вы используете имя шрифта «Ariel».Этого, вероятно, не существует.Ариал, то есть.Ариэль – это какое-то моющее средство.
На самом деле, правильное объявление последовательности без засечек будет таким:
font-family: Calibri, Tahoma, Arial, Helvetica, Sans-Serif;
«Проблема CSS в Internet Explorer.Я понятия не имею, в чем дело!»
Это можно услышать почти каждый день в моем офисе.
Мое единственное предложение — попытаться установить высоту фонового элемента.
Говоря о проблемах с CSS, контент выходит за пределы поля с тегами в вашем сообщении.
Попробуйте очистить плавающие элементы после того, как белый элемент div перекрывает фон (в котором есть все слова).Самый простой способ — добавить:
<div class="spacer"></div>
Сразу после конечного тега белого div.Если это не сработает, попробуйте добавить его в строку перед конечным тегом белого div.CSS для разделителя:
.spacer
{
clear: both;
height: 0;
line-height: 0;
font-size: 0;
}
Можете ли вы опубликовать сгенерированный HTML?
Я предполагаю, что IE не видит в вашем контейнере никакого контента с классом «контент».Это может быть связано с тем, что внутреннее содержимое не имеет hasLayout (волшебная вещь IE).
как предложил TM, попробуйте установить высоту на «1%», что должно вызвать hasLayout, или установите «zoom:1;», что тоже помогает.
вы можете пойти дальше и использовать сокращенный CSS для фона следующим образом:
background: url(yourimage.jpg) no-repeat top center;
Также ie6 не поддерживает background-attachment: исправлено кроме как на теле.
Трудно быть уверенным, не видя остальную часть вашего кода или работающий сайт, но это похоже на классическую проблему с плавающей запятой.Самый простой способ справиться с этим — добавить overflow: auto
в коробку, содержащую ваши поплавки (я предполагаю, что это .content
, здесь).Это должно растянуть обои до нужной высоты.
В противном случае попробуйте добавить прокладку «clearfix», которая Логан предложил до конца твоего .content
дел.