Tinymce Breaks forms in theme with this combo ZEN/MAC OSX/TinyMCE enabled/Mutliple textarea fields in forms

Is this with both Safari and Firefox? Or is it only happening on the Safari browser?

Also, please describe what the breakage is. The picture just shows a line across the middle of a textarea.

1. this was on the firefox 2.0 browser
2. hmmm...what i mean by breakage is that the bottom of the textarea window where the tinymce bar is located- merges, overlaps with other input areas of the form, and the buttons disappear making it basically unusable

Notes:

• i created a content type called tinymce test which was 4 text areas with tinymce enabled in order to recreate the issue
• i luv the theme and was looking forward to use it: a thousand thanks for any attention to the issue

jamie

We can also reproduce this error, on several (at least 4) sites all based on the Zen theme and on several systems. This only happens on Firefox on Mac OS X - not on Windows/Linux.

No idea where to start fixing it - it could potentially be a bug in the browser, in TinyMCE, or in the Zen theme.

After hours of hunting, I've located the bug. It's in modules/contrib-5/tinymce/tinymce/jscripts/tiny_mce/themes/advanced/css/editor_ui.css on line 34, the "a.mceButtonDisabled img" selector. Simply remove the opacity AND -moz-opacity properties and it works fine.

However, the opacity is there to distinguish disabled buttons from enabled ones, so you'll want to find some other way of distinguishing disabled buttons. I'm going to inform the TinyMCE creator about the issue, and hopefully he'll create a universal solution, as it's a shame to have to ditch this visual functionality just because of an exceptionally specific set of circumstances.

It seems weird that a "a.mceButtonDisabled img" selector could mess with Zen but not with other themes.

What is the full declaration for that rule? Can anyone confirm this is the solution?

I've had the same problem with Firefox on OSX using the Zen theme, tinyMCE and multiple textareas. Removing the opacity properties did solve the problem for us. Not sure, however, what the best alternative to using opacity might be.

Don’t know if this still affect the latest version of Zen.

i think it is general problem drupal's general use of javascript and how it reacts to this combo- reason being recently i have had multiple breakages in other themes - most noticeable where this happens in the garland theme; salamander; minelli theme in the module install page- as well as other pages that have collapsible areas. The work around I have been using as far as the module install page is using drupal's blue marine admin theme...because there have been similar problems(javascript) and not on just theme....i did not think of checking new install of the theme

I have the same problem, I am using the soccer theme from siteground in Mozilla Firefox on a Microsoft Windows XP machine. TinyMCE breaks the theme when I try and post material using it. I will try the solution proffered by SamLerner and let y'all know what happens.

Referencing the upstream issue @ TinyMCE (doesn't seem to be getting much attention):
https://sourceforge.net/tracker/index.php?func=detail&aid=1796741&group_...

FIXED (for me anyway).

Before trying out the solution suggested by SamLerner I decided to take a look at the off-line test version of my website and see if the issue occurred there. It did not.

I decided to compare the two TinyMCE's and noticed that my online (broken) version had lots of extra buttons turned on. When I turned these off it stopped messing up the tables on my website. I think, looking at the suggestion posted by SamLerner, that the issue that TinyMCE is having might be related to the way it orders buttons across the page. It seems that the buttons have a fixed position on the interface and that enabling or disabling them will merely make them visible/invisible to the users.

Perhaps the coders could take a leaf out of the games designer's book (I'm a games designer by trade) and structure out the TinyMCE interface as if it was an equipment inventory in an RPG. In terms of code, you'd have to assign a size to each of the small buttons (e.g. 1) and a big size to the big buttons (e.g. 3) then you could just have a fixed number of blocks that spread across the width of the style-sheet (e.g. 10 blocks) and have the program count how many of those blocks have been taken up by active buttons - if an active button, such as a the Font Selection and Font Size buttons is bigger than the space allowed by the blocks, have those buttons break onto a new row.

You could play around with the idea, but I reckon it might work.

If the fix is to edit TinyMCE and the bug has been duplicated with other themes, it's not a Zen issue.