[DOCS] Add note about limitations of CKEditor5 CSS styling

Resolves: #103310
Resolves: https://github.com/TYPO3-Documentation/Changelog-To-Doc/issues/859
Related: #103151
Related: #100768
Releases: main, 12.4
Change-Id: Ia1769439da1b85fc437ec3aca80f722b981eb183
Reviewed-on: https://review.typo3.org/c/Packages/TYPO3.CMS/+/83238


Tested-by: Christian Kuhn <lolli@schwarzbu.ch>
Reviewed-by: Christian Kuhn <lolli@schwarzbu.ch>
Tested-by: core-ci <typo3@b13.com>

typo3/sysext/rte_ckeditor/Documentation/Configuration/Examples.rst

@@ -71,6 +71,8 @@ In :file:`Configuration/RTE/MyPreset.yaml`, create your configuration, for examp
        contentsCss:
          - "EXT:my_extension/Resources/Public/Css/rte.css"
 
+See also the note for :option:`editor.config.contentsCss`.
+
 How do I customize the toolbar?
 ===============================
 

typo3/sysext/rte_ckeditor/Documentation/Configuration/Reference.rst

@@ -84,6 +84,13 @@ editor.config
    This is the default, as defined in `EXT:rte_ckeditor/Configuration/RTE/Editor/Base.yaml
    <https://github.com/typo3/typo3/blob/main/typo3/sysext/rte_ckeditor/Configuration/RTE/Editor/Base.yaml>`__.
 
+   .. note::
+      When adding custom styling and fonts, all CSS declarations need to be
+      prefixed with `.ck-content`. This scoping is applied by TYPO3
+      automatically to all custom CSS styles. Referenced CSS stylesheets need to
+      be downloadable via :js:`fetch()` in order for the JavaScript-based
+      prefixing to work.
+
 .. option:: editor.config.heading
 
    Defines headings available in the heading dropdown.