Topic on VisualEditor/Feedback

Tracked in Phabricator
Task T161489

Problem

An image resized to full horizontal width, using the visual editor goes overflows and may obscure the text in the sidebar.

Reproduction steps

1. Go to an article with an image, e.g. VisualEditor/Design/User testing and enter edit mode
2. Click on File:July31 toolbar.png
3. Click edit
4. Click Advanced settings
5. Click make full size
6. Click apply changes
7. Click publish changes
8. Click review changes
9. Click Visual

Expected

The image doesn't on top of the sidebar. A scroll bar can be use to see the rest of it.

Actual

The image goes beyond the preview section and is also visible in the sidebar.

Confirmed.. Might want to have at least overflow:hidden on .ve-ui-diffElement-content

Yes, this also happens full width (100%) "<pre>" blocks, and overflow hidden wouldn't work too well because it would hide some entered content, unless maybe a scroll bar is added to the separate preview area.