[BUGFIX] Fix RTE CKEditor placements of dropdowns in Chrome 47/55647/9
authorBenjamin Franzke <bfr@qbus.de>
Sat, 10 Feb 2018 12:26:50 +0000 (13:26 +0100)
committerBenjamin Kott <benjamin.kott@outlook.com>
Sat, 10 Feb 2018 20:07:07 +0000 (21:07 +0100)
commit480161c8d35475b1aec1f115c67a16ae301ab043
tree6be2c4665eab7b62eb99bab07c9de667b427aa5a
parentb8a6ee1600526415c04be2face017dc0bf0c3b89
[BUGFIX] Fix RTE CKEditor placements of dropdowns in Chrome

When used with the Chrome browser, the RTE CKEditor misplaces the
position of its dropdowns/context menus (opened via right-click)
when the viewport is scrolled. CKEditor calculates the offset relative
to the <body> and assumes <body> is as long as the content and that
the scrollbar is placed on <html> (both browser defaults).
As the TYPO3 backend uses 'overflow:auto' on <body> and 'overflow: hidden'
on <html> these assumptions conflict: Once the calculated offset exceeds
the <body> height (due tue scrolling) the chrome browser scrols up.

We now move the vertical scollbar into .module-body which implicitly
fixes the CKEditor offset calculation: The calculated menu offsets are
now relative to <body> (as assumed by CKEditor) and the scroll issues
disappear as we removed the scroll bar from <body>.

Resolves: #80116
Resolves: #82780
Releases: master, 8.7
Change-Id: I0481d4aaac1068577c9bad39e607486533ad4b6c
Reviewed-on: https://review.typo3.org/55647
Tested-by: TYPO3com <no-reply@typo3.com>
Reviewed-by: Mathias Schreiber <mathias.schreiber@typo3.com>
Tested-by: Mathias Schreiber <mathias.schreiber@typo3.com>
Reviewed-by: Anja Leichsenring <aleichsenring@ab-softlab.de>
Tested-by: Anja Leichsenring <aleichsenring@ab-softlab.de>
Tested-by: Riccardo De Contardi <erredeco@gmail.com>
Reviewed-by: Benjamin Kott <benjamin.kott@outlook.com>
Tested-by: Benjamin Kott <benjamin.kott@outlook.com>
Build/Resources/Public/Sass/component/_module.scss
typo3/sysext/backend/Resources/Public/Css/backend.css
typo3/sysext/backend/Resources/Public/JavaScript/DocumentHeader.js
typo3/sysext/install/Resources/Public/Css/install.css