Web Stories preview middle view styling issues

[adamdunnage]

Description

Currently when using the preview function in Web Stories from a Chrome or Edge browser, the middle preview view does not reflect the other two views either side of it and has some styling issues.

This seems to always happen when the browser window is full screen but shrinking the window will eventually fix the problem.

Screenshots of this issue:

https://prnt.sc/1zt80nd

Video recording of the issue as it happens:
https://user-images.githubusercontent.com/91896826/142221398-5937ebea-af12-4fcc-b5e5-76216d55f534.mp4

I couldn't recreate this with a newly created story but older published stories I could recreate consistently.

Related Web Stories ticket: https://wordpress.org/support/topic/images-text-cut-off-in-preview-mode/

Reproduction Steps

1. Open up a previously published Web Story.
2. Select the Preview option.
3. Allow all views to load on screen.
4. Optional: Minimise/maximise the browser window size.

Relevant Logs

No response

Browser(s) Affected

Chrome, Edge

OS(s) Affected

No response

Device(s) Affected

No response

AMP Version Affected

No response

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed in 7 days if no further activity occurs. Thank you for your contributions.

[ychsieh]

Not reproducible.