Мобильная версияЯ создаю форму, в которую добавляю значок, который указывает на поле, когда пользователь наводит курсор на значок.
Ниже мой код и CSS:
.tooltip { положение: относительное; отображение: встроенный блок; непрозрачность: 1; } .tooltip .tooltiptext { видимость: скрыта; ширина: 350 пикселей; цвет фона: #83837F; цвет: #fff; радиус границы: 6 пикселей; отступ: 5 пикселей 0; позиция: абсолютная; z-индекс: 1; верх: 25 пикселей; отступ: 5 пикселей; } .tooltip:hover .tooltiptext { видимость: видимая; } .tooltiptext:перед { -webkit-box-sizing: граница-коробка; -moz-box-sizing: граница-коробка; размер коробки: граница-коробка; z-индекс: 100001; содержание: ' '; позиция: абсолютная; ширина: 0; высота: 0; поле: 2 пикселя 0 0 8 пикселей; низ: 100%; слева: 0; левая граница: 8 пикселей, сплошная прозрачная; правая граница: 8 пикселей, сплошная прозрачная; нижняя граница: 8 пикселей сплошная #83837F;
Произвольный текст Произвольный текст Произвольный текст Произвольный текст Произвольный текст Произвольный текст Произвольный текст
Произвольный текст Произвольный текст Произвольный текст Произвольный текст Произвольный текст Произвольный текст Произвольный текст
В примере выше, когда я навожу курсор на первую всплывающую подсказку, ее tooltiptext становится видимой, но вторая всплывающая подсказка img перекрывает ее.
Я хочу добавить самый высокий z-индекс в tooltiptext, чтобы изображение всплывающей подсказки, расположенное под ним, не перекрывало его.
