CSS - переписанный стиль Visual Composer не применяет то, что я вижу в консоли Chrome - PullRequest
0 голосов
/ 20 января 2019

У меня проблема, и я понятия не имею, что происходит.Я использую тему WordPress, которая использует Visual Composer, и я хочу, чтобы изображение в одном ряду отображалось перед другим рядом с ним.Я дошел до того, что добавил относительное расположение и высокий z-индекс на изображении и низкий z-индекс в строке div выше.

Ничего из того, что я пробовал (например, изменение различных значений и позиций z-индекса), не заставляет это изображение находиться в начале строки div над ним.

Затем я посмотрел на правила CSS, используемые Visual Composer, и выяснил, влияет ли какое-либо из них на них.Единственное, что я нашел, это одно переполнение: скрытое;правило (в строке над изображением), которое, когда я сниму флажок в инструментах разработчика Chrome, будет работать, и перед этим рядом будет отображаться изображение.

Однако я применил свое собственное правило CSS для переполненияв строке div, чтобы перезаписать это правило Visual Composer, но когда я загружаю веб-страницу, это не имеет никакого значения, даже если оно вычеркнуто на инструментах разработчика и мои стили выглядят так, как будто его перезаписывают.

Я имеюприложил два изображения, чтобы проиллюстрировать это:

enter image description here

enter image description here

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

1 Ответ

0 голосов
/ 20 января 2019

Ваш пример кода неполон и недостаточен для решения вашей проблемы, но есть некоторые проблемы с вашими стилями и общим подходом.

  1. Правильный стиль - "overflow-x: auto!важный;"с пробелом перед! важно.Некоторые браузеры могут правильно интерпретировать auto! Важный, но он недействителен и не даст надежных результатов.

  2. Использование! Важный почти никогда не является хорошей идеей.Это идет вразрез со всей целью таблиц стилей.Попробуйте создать иерархический стиль, который переопределяет настройки по умолчанию только для ваших конкретных потребностей.Пример:

    .myContainer .row .myDiv .vc_row [data-vc-full-row] .my-heading-area {
    переполнение: авто;
    overflow-x: авто;
    overflow-y: auto;
    }

Вы можете использовать! важный там, если вам абсолютно необходимо, по крайней мере, таким образом, вы не переписываете глобальные стили для локальной проблемы.

...