Custom HTML block preview not same as the Frontend Views

[algorithmsunlocks]

To reproduce the issue, you will need to follow the steps:

1. Activate the Twenty-Fourteen theme.
2. Choose the custom HTML block.
3. Add a few heading tags to it.
4. Check the preview in the HTML block and also the Frontend View

Have a look at the below screenshot.
​https://prnt.sc/72nMe8HmIr_S
​https://prnt.sc/1dV9rgwAsEIS

[algorithmsunlocks]

Here is the test video link;
​https://www.loom.com/share/3e341054c63c4001b419ce6ae8893908

[sabernhardt]

This is an editor problem that can happen with any theme.

All direct child elements inside the block preview's div have no margin.

	body > div > * {
		margin-top: 0 !important; /* Has to have !important to override inline styles. */
		margin-bottom: 0 !important;
	}

(from ​sandbox/index.tsx)

If you could, please open an issue on the ​Gutenberg repository.

[algorithmsunlocks]

I have opened a bug report to the WordPress Gutenberg GitHub repo: ​https://github.com/WordPress/gutenberg/issues/52438

[sabernhardt]

Thanks for moving the report!