Диалоговое окно z-index для кнопки отправки в Facebook

Question

Как мне исправить следующую проблему:

Я пытался установить z-index моих изображений на -1, но в IE и Opera они идут заrgba фон их контейнера:

Здесь вы можете увидеть следующую проблему (в IE и Opera):

http://dump.ly/LVWY1v6oCPX9

Answer 1

Вам следует избегать использования отрицательных значений z-index, так как эти элементы являются одной из первых вещей, которые нужно нарисовать, когда браузер создает страницу (дополнительную информацию можно найти в этом ответе SO ), что означает что элементы могут появляться за вещами, которые вы не можете ожидать (элементы в потоке и т. д.).

Чтобы убедиться, что раскрывающийся список facebook всегда находится над изображениями, вы можете применить больший z-index к родительскому элементу facebook - в данном случае #dump_options - чем элемент, содержащий изображения - в данном случае .preview.

Итак, ваш CSS может быть:

#dump_options {
    ...
    position: relative;
    z-index: 10;
    ...
}

.preview {
    ...
    position: relative;
    z-index: 1;
    ...
}

Answer 2

Если установка z-индекса родителя не делает этого, попробуйте установить z-индекс родителя и т. Д. Помните, что z-индексы могут быть вложенными.

Answer 3

Попробуйте изменить CSS на это:

*Images Class*{
   opacity:0.4;
   filter:alpha(opacity=40); /* For IE8 and earlier */
}

Ссылка, W3Schools