Details
Major Description
The general problem is the use of different id's (like xwikimaincontainerinner) inside selectors which apply to document content. For the WYSIWYG to do what its name suggests it has to use the same style as in view mode. This means importing the toucan.css stylesheet. If in view mode the content can have as many (div) wrappers as we want, in edit mode this is not practical. This means that in edit mode I can have only one content wrapper which is the BODY element. This implies that I can use only one id. Right now we have:
<body id="body" class="main"> <!-- document content here --> </body>
As a consequence the styles for code and box macro doesn't apply in edit mode. The fix would be to use #body or .main instead of #xwikimaincontainerinner:
/* toucan.css (line 282) */
#xwikimaincontainerinner .box {
...
}
/* toucan.css (line 290) */
#xwikimaincontainerinner .code {
...
}
#xwikimaincontainerinner .code pre {
...
}