Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

The editor's hover controls CSS can be overridden by theme CSS containing "#something ul" selector. #2342

Closed
ZebulanStanphill opened this issue Sep 6, 2017 · 1 comment

Comments

Projects
None yet
2 participants
@ZebulanStanphill
Copy link

commented Sep 6, 2017

Description

css can be overwritten by accident too easily

The CSS for the styling of the on-hover controls in the Elementor editor appear to use selectors that are too weak, resulting in something as generic as a check for "#something ul" overriding the CSS.

I noticed this while trying out the Elementor editor on a site using the Divi theme, though it is not a Divi-specific issue. It affects any theme that does the following:

  1. Have CSS to define the padding of a ul tag that is a descendant of an element with a particular id. ("#something ul")
  2. Uses that CSS id on an element used on every page, such as the div containing the content of the page.

(Note: I have checked, and a ".something ul" selector does NOT override the CSS, which is good.)

Steps to reproduce

  1. Use a theme whose base CSS defines padding for ul tags that are descendants of an element with a certain id. (Set the padding to be something that will appear obvious when it is applied.)
  2. Use the Elementor editor on a page where the on-hover controls will be descendants of an element with the aforementioned id, and look at the hover controls.

Easy version:

  1. Use the Divi theme. (I tested on the latest version as of posting: 3.0.72, though I don't think this behavior should be any different on older/newer versions.)
  2. Use the Elementor editor on a page and look at the hover controls.

@arielk arielk added the compatibility label Sep 8, 2017

arielk added a commit to arielk/elementor that referenced this issue Sep 8, 2017

@arielk

This comment has been minimized.

Copy link
Contributor

commented Sep 8, 2017

Fix for v1.7.3.

Thanks for your feedback!

@arielk arielk closed this Sep 8, 2017

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.