Forms: general styling issues editor vs. published view - differences in styling between editor and published rendering

[digitalwaveride]

A simple example:

Label styling, input field styling (line-heights) ... are often not the same.

For certain themes the differences are more drastic, example TwentyTwentyOne theme:

Also discussed in:

#27837 (comment)
#27837 (comment)

[github-actions]

This issue has been marked as stale. This happened because:

• It has been inactive in the past 6 months.
• It hasn’t been labeled `[Pri] BLOCKER`, `[Pri] High`, `[Type] Feature Request`, `[Type] Enhancement`, `Good For Community`, `[Type] Good First Bug`, etc.

No further action is needed. But it's worth checking if this ticket has clear reproduction steps and it is still reproducible. Feel free to close this issue if you think it's not valid anymore — if you do, please add a brief explanation.

[sdixon194]

This looks better to me now, but still has some differences like the bolded outline on the fields and still some slight line height differences.

[ntsekouras]

Is this still valid? I couldn't spot any differences with a couple of themes.

If someone has more info about specific differences and a testing theme (and ensuring it's not style overrides from the used theme) it would be helpful. Otherwise maybe we should close this one?

[Robertght]

@ntsekouras I tested this using TwentytwentyOne on a self-hosted environment and I can confirm it's the same as shown in the screenshots above.

In short we're missing the borders of the fields on this particular example.

Twentyseventeen looks fairly the same.

Here's another example with Varia: Automattic/themes#4825