By JimK on

The Tinymce editor window on my site gives a tiny, very hard to edit, font size. I have it drawing css from the theme which is Chameleon. I assumed that it took it from the 'body' css and increased it a little, but it did nothing for the Tiny editor window.

Which css class in the common.css is being used by Tiny? Anyone know?
Is it a percentage of the body (eg looks about 50% of body size to me). Is there a way to hack Tiny to get it to use a bigger size?

⋅ Categories: Drupal 4.6.x

Comments

budda’s picture

budda
Primary language English
Location Cheshire
commented

Set TinyMCE to use a specific css file for the editor. "Editor CSS" as it's called in TinyMCE settings.

Here's my style for the editor:

/* TinyMCE Styles */
body {
	background-color: #FFFFFF;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10pt;
	scrollbar-3dlight-color: #F0F0EE;
	scrollbar-arrow-color: #676662;
	scrollbar-base-color: #F0F0EE;
	scrollbar-darkshadow-color: #DDDDDD;
	scrollbar-face-color: #E0E0DD;
	scrollbar-highlight-color: #F0F0EE;
	scrollbar-shadow-color: #F0F0EE;
	scrollbar-track-color: #F5F5F5;
	margin: 5px;
}

td {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
}

pre {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
}

.mceVisualAid {
	border: 1px dashed #BBBBBB;
}

img {
  border: none;
}

--
Custom Drupal templates | More Drupal modules

--
Ixis (UK): Drupal support, Drupal hosting.

JimK’s picture

JimK commented

Thanks for your reply, and your css. It clears the background but the font size stays the same. It's easier to see though!
www.cpnhelp.org

Fransie’s picture

Fransie commented

I would also like to be able to have the TinMCE editor use settings from the theme CSS. That way, if you change a theme, the editor will change accordingly. It is supposed to be a WYSIWYG editor, isn't it? So it would be nice if the TinyMCE editor would use the same style as the rest of the site.

As it is now, I also have the problem of noit being able to control the font size in the editor window. If I use the 'View Style Information' of my Firefox CSS extension, it tells me the style used for text in the editor pan is "body .mceContentBody". But setting this in the theme's style.css does not do anything and neither does changing other settings.

It seems that although I have set "Editor CSS:" to "use theme CSS: in the TinyMCE settings, the theme CSS is not used.

Could anyone please explain how you can control the TinyMCE font using the CSS of your drupal theme?