Блог

Главная - Вопросы по программированию - Абсолютная позиция — отрицательная справа и сверху: ошибка Internet Explorer

Абсолютная позиция — отрицательная справа и сверху: ошибка Internet Explorer

#html #css #internet-explorer

#HTML #css #internet-explorer

Вопрос:

У меня есть плавающее диалоговое окно с кнопкой закрытия в правой верхней части. Он отлично работает с FF и Chrome, а также с IE 9 (при изменении режима браузера он кажется совместимым с IE7 через IE9). Но в IE 8 кнопка закрытия не отображается.

Есть ли какое-либо решение этой проблемы, которое есть у IE?

 .dBox
{
  display: block;
  position: fixed;
  z-index: 91;
}

.dBox .dContent
{
  display: block;
  border: 2px solid #666666;
  padding: 5px;
}

.dBox .dButtonClose
{
  background-image: url("img/close.dbox.png");
  cursor: pointer;
  height: 24px;
  width: 24px;
  position: absolute;
  right: -20px;
  top: -20px;
  display: block;
  z-index: 90;
}

<div class="dBox" style="display: block; top: 46px; left: 533px;">
  <div class="dContent">content here</div>
  <div class="dButtonClose" style="display: block;"></div>
</div>

Комментарии:

1. Возможно, в . Элемент dButtonClose. Вы пробовали вводить текст, чтобы узнать, отображается ли он в IE8?

2. Я не вижу ничего особенно плохого, хотя у меня нет close.dbox.png, поэтому мне пришлось заменить красный фон.

3. Это работает для меня в IE8: jsfiddle.net/HZPUh/1 Не может размножаться.

4. Пример Алексея отлично работает в IE8, но не работает в режиме совместимости. Попробуйте с jsfiddle.net/HZPUh/2 Я меняю right: -20px; с right: 0; in . dBox . dButtonClose

5. Это работает для меня, но попробуйте следующее: 1. Убедитесь, что на ваше изображение указана правильная ссылка. 2. Может быть какая-то проблема со стеком IE z-index. Сделайте z-индекс кнопки выше, чем поле.