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

Responsive color control styling issue still exists in latest Elementor version #6227

Closed
pkvillanueva opened this issue Nov 20, 2018 · 3 comments

Comments

Projects
None yet
2 participants
@pkvillanueva
Copy link

commented Nov 20, 2018

Prerequisites

  • I have searched for similar issues in both open and closed tickets and cannot find a duplicate.
  • The issue still exists against the latest stable version of Elementor.

Description

As the title explains, here is the screenshot:

2018-11-20 18 25 09

Isolating the problem

  • This bug happens with only Elementor plugin active (and Elementor Pro).
  • This bug happens with a default WordPress theme active.
  • I can reproduce this bug consistently using the steps above.

Environment

https://pastebin.com/APefwWuN

@bainternet

This comment has been minimized.

Copy link
Collaborator

commented Nov 27, 2018

@pkvillanueva

Which widget is it? where can I see it?

@pkvillanueva

This comment has been minimized.

Copy link
Author

commented Nov 29, 2018

@bainternet

The screenshot given is from my personal custom widget that I was working on. Unfortunately, there's no similar widget case in Elementor and Elementor Pro that I could share to you. You can simply replicate this issue by adding this code to any widget.

$this->add_responsive_control(
	'responsive_color',
	[
		'label' => __( 'Color', 'elementor' ),
		'type' => 'color',
	]
);
@bainternet

This comment has been minimized.

Copy link
Collaborator

commented Dec 17, 2018

@pkvillanueva

What you can do is add 'label_block' => true to your control:

$this->add_responsive_control(
	'responsive_color',
	[
		'label' => __( 'Color', 'elementor' ),
		'type' => 'color',
		'label_block' => true,
	]
);

And then with a little CSS:

.elementor-control-responsive_color .elementor-control-input-wrapper {
    width: 100% !important;
}

You should get something like this:
t0hp5p1

@bainternet bainternet closed this Dec 17, 2018

joshmarom added a commit to joshmarom/elementor that referenced this issue Dec 17, 2018

KingYes added a commit that referenced this issue Dec 17, 2018

Merge pull request #6465 from joshmarom/release/2.3.6
Controls responsive switcher position (#6227)
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.