Repository navigation
Images overflow horizontally and overlap sidebar content on the Performance page #354
Description
Issue Description
On the Performance page of the Hosting Handbook, several images are not responsive. This causes horizontal scrolling and overlapping with the sidebar, breaking the layout on both desktop and smaller viewports.
Steps to Reproduce
- Visit https://make.wordpress.org/hosting/handbook/performance/.
- Scroll to the Full Page Cache section.
- Notice that the image extends beyond the content area.
- Scroll to the Object Cache section and observe the large diagram overlapping with the sidebar.
Expected Behavior
- Images should scale within the content container.
- No horizontal scrolling.
- Sidebar remains fully visible without overlap.
Actual Behavior
- Images overflow horizontally.
- Horizontal scrollbar appears.
- Sidebar overlaps with images, breaking the layout.
Screenshots
1. Horizontal overflow
2. Sidebar overlap
Environment
- Browsers: Chrome 139.0.7258.66 (64-bit), Firefox 143.0.4 (64-bit)
- Incognito: Reproducible
Activity
Successfulsebunya commentedon Oct 15, 2025
Issue Reproduction
###Environment
Browser: Brave browser v 1.83.112
Reproducible in Incognito: Yes
Both Logged in and not logged users
###Screenshots
Merge branch 'main' into WordPress#354
kittenkamala commentedon Oct 28, 2025
Resolved with #358
kittenkamala commentedon Oct 29, 2025
Unfortunately the issue persists. We could try adding a max width and height like
<style="max-width: 700px; height: auto;">kittenkamala commentedon Oct 30, 2025
After testing by directly editing html in make /hosting/wp-admin and using preview, I landed on this:
style="max-width: 100%; max-height: 100%; object-fit: contain;"#362
Merge pull request #362 from kittenkamala/354-amy