Выпадающий список, появляющийся за виджетом. Исправимо?

Я действительно надеюсь, что пишу это в нужном месте, приношу свои извинения, если нет. Я недавно изменил свою тему Wordpress, и при этом одно из выпадающих меню, которое я отлично использовал в моем старом дизайне, больше не отображается правильно.

На следующей странице есть поле поиска «Выбрать по стране». Проблема в том, что раскрывающееся меню на самом деле не отображается как раскрывающееся - это сложно описать, но похоже, что оно отображается в iframe.

https://www.escxtra.com

Я пробовал несколько изменений CSS, но ничего не исправило. Буду очень признателен за любую помощь.

Моя кодировка формы выглядит следующим образом: https://codeshare.io/ayrWmn

css iframe dropdown

15.06.2018 21:34

Приемы CSS-макетирования - floats и Flexbox

Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...

Введение в CSS

CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.

Как выровнять Div по центру?

Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...

Навигация по приложениям React: Исчерпывающее руководство по React Router

React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

CSS: FlexBox

Ранее разработчики использовали макеты с помощью Position и Float. После появления flexbox сценарий полностью изменился.

Ответы 1

Вы можете расположить вещи спереди и сзади, используя z-index, это правило CSS определяется числами, и наибольшее число находится впереди. Это называется «порядком стека».

Примените правило к обоим элементам, тот, который вы хотите впереди, сделайте это: z-index: 2;, а тот, который вы хотите за ним, поместите z-index: 1;

Возможно, вам не понадобится применять z-index к тому, который вам нужен сзади. В этом правиле разрешены отрицательные числа.

Узнайте больше о z-index здесь: w3 школы

Спасибо за ваш ответ. Я попытался добавить z-index, как описано, но мне все еще не удается отобразить раскрывающийся список перед виджетом, который расположен под ним. Единственное, что, кажется, меняет ситуацию, - это добавление свойства «переполнение» - установка этого значения на visible показывает раскрывающийся список, но выглядит несколько прозрачным :(

— 15.06.2018 23:22

@DannyNi, пожалуйста, добавьте фрагмент кода той области, в которой у вас возникли проблемы, спасибо.

— 16.06.2018 01:02

@DannyNi Хорошо, я посмотрел на ваш веб-сайт и выбрал страну, один из div, обертывающий ваш раскрывающийся список, на самом деле запрещает расширение раскрывающегося списка из-за чего-то вроде фиксированного height. Проверьте и посмотрите, имеет ли какой-либо из классов, связанных с элементами, окружающими ваш раскрывающийся список, определенное значение для height, может быть, включить CSS в этот задействованный jsfiddle? Спасибо! Что касается прозрачности, проверьте непрозрачность, ваши родительские элементы могут переходить в раскрывающийся список.

— 16.06.2018 05:05

15.06.2018 22:11