Приведи пример бага, специфичного для конкретного браузера (кроссбраузерная проблема).

Пример: Баг с контекстом наложения (z-index) в старых версиях Internet Explorer (IE6, IE7).

Проблема: В IE z-index элемента рассчитывается не глобально, а в пределах родительского контейнера, у которого тоже задан z-index. Это ломает ожидаемый порядок наложения.

Пример HTML/CSS:

<div style="position: relative; z-index: 1;">
    <!-- Этот контейнер создаёт новый контекст наложения в IE -->
    <div style="position: relative; z-index: 1000; background: red;">
        Должен быть сверху (z-index: 1000)
    </div>
</div>

<div style="position: relative; z-index: 2;">
    <!-- Этот контейнер имеет больший z-index, чем первый родитель -->
    <div style="position: relative; z-index: 1; background: blue;">
        Но в IE этот блок перекроет красный (z-index: 1)
    </div>
</div>

Объяснение: В современных браузерах красный блок (z-index: 1000) будет поверх синего (z-index: 1). В IE6/7 синий блок окажется поверх красного, потому что его родительский контейнер имеет z-index: 2, что больше, чем z-index: 1 у родителя красного блока. z-index дочерних элементов сравниваются только внутри своего родительского контекста.

Решение:

1. Выравнивать иерархию DOM, чтобы сравниваемые элементы находились в одном контексте наложения.
2. Использовать полифиллы или условные комментарии для IE.
3. Избегать сложных вложенностей с z-index.