Long page titles in the overlay make the overlay-content too wide, causing a horizontal scroll bar. The attached patch fixes the issue by allowing the title to wrap onto multiple lines, pushing the overlay-title down the page.

See the attached before and after screenshots.

The screenshots are from Google Chrome. The bug occurs in Google Chrome and I expect also exists in all other compliant browsers. The patch has been tested in Chrom only, but should fix the issue in all compliant browsers. Other browsers need further testing.

CommentFileSizeAuthor
#2 custom.zip2.44 KBBevan
#2 custom-overlay-child.css_.txt564 bytesBevan
After wide.png166.84 KBBevan
Before wide.png186.75 KBBevan
Before-1.png114.5 KBBevan
After.png128.26 KBBevan
overlay-title-wrap.patch748 bytesBevan

Comments

Bevan’s picture

Bevan commented

The bug was introduced in #668640: Overlay shouldn't be based on jQuery UI Dialog or in the code it was refactoring.

Related; #724562: Overlay title gets covered up by tabs.

Bevan’s picture

Bevan commented
StatusFileSize
new custom-overlay-child.css_.txt564 bytes
new custom.zip2.44 KB

The attached CSS file is a shim to fix the issue without needing to modify core, by extending & overriding overlay module's CSS styles. Add it to a custom module or theme.

The attached zip file is a micro-module that adds the CSS shim file to all pages. It includes the CSS shim file. It is not tested. Install it as per usual.

Status: Needs review » Needs work

The last submitted patch, overlay-title-wrap.patch, failed testing.

Bevan’s picture

Bevan commented
Status: Needs work » Needs review

overlay-title-wrap.patch queued for re-testing.

aaronbauman’s picture

aaronbauman
he/him
commented
Version: 7.0 » 7.x-dev

This issue persists.

Bevan’s picture

Bevan commented

overlay-title-wrap.patch queued for re-testing.

digitgopher’s picture

digitgopher commented
Issue summary: View changes
Status: Needs review » Needs work

Thanks, this works for me on initial page load. However, as soon as you resize the browser it reverts to the previous behavior. Is there a quick fix?

Status: Needs work » Closed (outdated)

Automatically closed because Drupal 7 security and bugfix support has ended as of 5 January 2025. If the issue verifiably applies to later versions, please reopen with details and update the version.