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

Line-height property on Heading widget #3197

Closed
tudormnt opened this Issue Jan 16, 2018 · 4 comments

Comments

Projects
None yet
3 participants
@tudormnt

tudormnt commented Jan 16, 2018

There is a possibly useless specification of the line height on the .elementor-widget-heading .elementor-heading-title selector in the main front-end css file. The line-height is set to 1.

That causes all styles that target headings (h1, h2 etc.) to be overridden by this property and it is impossible to fix since class selectors superceed element selectors and the class is on the actual heading element.

Is there any reason why this is necessary? The heading should inherit the line-height from the theme which in all cases is specified using the simple html tag selector, without any class.

Thanks!

@bainternet

This comment has been minimized.

Collaborator

bainternet commented Jan 16, 2018

@tudormnt

I don't understand what you mean because if you set the line hight for a heading widget specifically it will be set on the front end.

please explain what the issue is?

@black-eye

This comment has been minimized.

black-eye commented Jan 16, 2018

I think @tudormnt means, that the .elementor-heading-title CSS overrides the line-height value, which is already specified by the theme.

I'm facing the same problem: in every custom theme I have to override this value back with extra CSS. It's doable and it's no big deal, but if it isn't necessary, it would be better to use the value inherited from the theme.

Of course I could specify the new value in the widget in the editor, but that would be a lot of redundant work.

@tudormnt

This comment has been minimized.

tudormnt commented Jan 17, 2018

@bainternet I mean exactly what @black-eye explained.
Of course you can override the line-height from the typography control but Elementor should inherit this from the theme and only override through the widget settings whenever required.

Moreover, headings will almost NEVER have a line-height of 1 in professionally designed websites. That is a very low value. Almost all fonts require a bigger value for better legibility.

I was hoping you could explain why this is set in the first place since it seems it's not needed. Can we get an answer for that, please?

@bainternet

This comment has been minimized.

Collaborator

bainternet commented Jan 28, 2018

@black-eye Thanks,

@tudormnt,

I see what you mean and I do see how its problematic. Sadly its something we are carrying form the early versions of Elementor which means it runs on (currently) 475,000 sites and removing that will change/break layouts on these sites.

We did have some brainstorming sessions here about this and some other issue that came up, and we will have to address this and more once we provide a "theme builder"...

Think about a case when a user uses the theme builder and his theme has no typography to inherit...

So this will probably end up being something like a global Typography settings module.

Thanks for the feedback.

@bainternet bainternet closed this Jan 28, 2018

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment