Download & Extend
Marinelli » Issues

Theme CSS vs. TinyMCE CSS

Posted by LansingIT on November 1, 2007 at 1:51pm
Project:Marinelli
Version:5.x-1.0
Component:User interface
Category:support request
Priority:minor
Assigned:Unassigned
Status:closed (won't fix)

Issue Summary

Hello thanks for the very nice theme. When I enable tinymce it seems the background color blue bleeds thru and i can not see the text in the text area.
Do I need to add something to the style sheet to fix this? Thanks in advance for any insight.

BK

Login or register to post comments

Comments

#1

Posted by Lioz on November 2, 2007 at 8:13am

can you add a screenshot? thanks!

#2

Posted by LansingIT on November 3, 2007 at 9:05pm

Here is what it looks like.

AttachmentSize
wysiwygone.gif 8.33 KB

#3

Posted by kurikuri on November 4, 2007 at 5:28am

I had this same problem. What you need to do is configure TinyMCE to accept the default TinyMCE settings. Don't use the Marinelli theme for TinyMCE. Very simple edit from TinyMCE. Good luck.

#4

Posted by LansingIT on November 4, 2007 at 8:50pm
Status:active» fixed

Thanks: In the TinyMCE Settings I had to set the CSS to use TinyMCE Default instead of the theme CSS

BK

#5

Posted by Anonymous on November 18, 2007 at 8:52pm
Status:fixed» closed (fixed)

Automatically closed -- issue fixed for two weeks with no activity.

#6

Posted by jwolf on November 24, 2007 at 6:28am

FYI

body.mceContentBody
{
background:#fff;
color:#000;
font-size:12px;
}

body.mceContentBody a:link
{
color:#ff0000;
}

#7

Posted by gostram on December 12, 2007 at 10:21am
Title:TinyMCE suport?» Theme CSS vs. TinyMCE CSS
Status:closed (fixed)» active

I am running into a weird issue:

1. when I tell TinyMCE to use its CSS style, then the text is correctly aligned to the left in the editing window, but the formatting is different from the one that will appear on the site

2. When I tell TinyMCE to use the theme style, then the text is aligned to the center but the formatting in the editing window is the same as the one that will appear on the site

I would rather use the theme CSS, it makes more sense when editing to visualize what the fonts will look like, but I really don't know how to get the text to the left by default.

Should I create a new CSS file based on the theme style and modify something somewhere to get the text aligned to the left?

#8

Posted by gostram on December 13, 2007 at 7:12pm

I think I found something relevant (that's for Mambo, but it looks lie it is the same issue). Not too sure how to solve it though:

http://forum.mamboserver.com/showthread.php?t=32644

#9

Posted by gostram on December 18, 2007 at 9:17am

Ok I found the solution, even though I am not sure it doesn't disrupt other things:

You have to replace this in styles.css:

body {
font-family: "Lucida Grande","Lucida Sans Unicode", helvetica, verdana, arial, sans-serif;
font-size:78%;
font-size-adjust:none;
font-stretch:normal;
line-height:1.6em;
color: #333;
letter-spacing:normal;
background: #EDEDED url(img/body.gif);
text-align: center;
margin: 40px 0 20px 0;
}

by this:

body {
font-family: "Lucida Grande","Lucida Sans Unicode", helvetica, verdana, arial, sans-serif;
font-size:78%;
font-size-adjust:none;
font-stretch:normal;
line-height:1.6em;
color: #333;
letter-spacing:normal;
background: #EDEDED url(img/body.gif);
text-align: left;
margin: 40px 0 20px 0;
}

#10

Posted by gostram on December 18, 2007 at 9:18am
Status:active» fixed

so fixed apparently

#11

Posted by Anonymous on January 1, 2008 at 9:21am
Status:fixed» closed (fixed)

Automatically closed -- issue fixed for two weeks with no activity.

#12

Posted by tdimg on January 1, 2008 at 10:03am

Rather than changing the body (not sure but this could have other implications on the theme), add this line to the stylesheet:

body.mceContentBody {
text-align: left
}

This way, you specifically address the tinymce textarea.

#13

Posted by poehnix on March 5, 2008 at 3:42pm
Status:closed (fixed)» active

I have both issues (alignment centered and background color=theme bg color with FCKEditor. No css class is associated to the textarea
Using Firebug the html looks like this

id="fck_oFCK_1">
<input id="oFCK_1___Config" type="hidden" style="display: none;" value="CustomConfigurationsPath=%2Fdrupal-6.0%2Fsites%2Fall%2Fmodules%2Ffckeditor%2Ffckeditor.config.js&TextareaID=edit-body&SkinPath=%2Fdrupal-6.0%2Fsites%2Fall%2Fmodules%2Ffckeditor%2Ffckeditor%2Feditor%2Fskins%2Fdefault%2F&DefaultLanguage=en&AutoDetectLanguage=true&ToolbarStartExpanded=true&EnterMode=p&ShiftEnterMode=br&FontFormats=p%3Bdiv%3Bpre%3Baddress%3Bh1%3Bh2%3Bh3%3Bh4%3Bh5%3Bh6&FormatSource=true&FormatOutput=true&LinkBrowser=false&ImageBrowser=false&FlashBrowser=false&LinkUpload=false&ImageUpload=false&FlashUpload=false&EditorAreaCSS=%2Fdrupal-6.0%2Fthemes%2Fmarinelli%2Fstyle.css%2C%2Fdrupal-6.0%2Fsites%2Fall%2Fmodules%2Ffckeditor%2Ffckeditor.css"/>
<iframe width="0" scrolling="no" height="0" frameborder="0" src="javascript:void(0)" style="position: absolute; z-index: 10000;">
</iframe>
<iframe width="0" scrolling="no" height="0" frameborder="0" src="javascript:void(0)" style="position: absolute; z-index: 10000;">
</iframe>
<iframe id="oFCK_1___Frame" width="100%" scrolling="no" height="420" frameborder="0" src="/drupal-6.0/sites/all/modules/fckeditor/fckeditor/editor/fckeditor.html?InstanceName=oFCK_1&Toolbar=DrupalFiltered">
<html>
</html>
</iframe>
<textarea id="oFCK_1" style="display: none;"/>
</div>

I have tried

#fck_oFCK_1
{
background-color:#fff;
text-align: left;
z-index: 100000;
}

#xEditingArea
{
background-color: #fff;
text-align: left;
z-index: 100000;
}

#oFCK_1
{
background-color:#fff;
text-align: left;
z-index: 100000;
}

#oFCK_1___Frame
{
background-color:#fff;
text-align: left;
z-index: 100000;
}

with no results....

It seems to me that the rules are applied first and then overridden by the body bgcolor.... Any suggestion on how to solve this?
Thanks
poehnix

#14

Posted by phph on March 24, 2008 at 2:06am

"For avoiding body background (image, colors) propagate to the FCKeditor body, simply go to "admin-->settings-->fckeditor-->edit (the used profiles)" and under the section "CSS" choose "FCKeditor default" instead of "use theme css"."

at http://drupal.org/node/209482 by BadMaster (http://drupal.org/user/116147).

Best Regards,
Pedro Henrique
www.phph.com.br

#15

Posted by poehnix on March 26, 2008 at 8:49am

Thanks. After trying between the options provided in the settings I decided to use a custom css equal to the theme but without the background.
Of course this fails if you are using multiple templates or multiple sites

Thanks again

poehnix

#16

Posted by Gunderstorm on April 6, 2008 at 6:21pm

Thankyouthankyouthankyou!

#17

Posted by cynthia_m on April 9, 2008 at 10:40am

I got it... Tanx.....

#18

Posted by Pok on May 30, 2008 at 10:36am

Just in case nobody noticed: on the "Tips&Tricks" page of fckeditor.net there is a step by step explanation to fix this problem as well as the incorrect alignment.
The explanation uses the Marinelli theme as an example. Lucky us! hehe :)

#19

Posted by andresloft on July 3, 2008 at 3:51am

Hi...

Using TinyMCE with Marinelli theme, I'm facing the problem of the text editor box extending out to the background. I've attached a screenshot of the said problem.

Anyone has any idea of rectifying this problem?

AttachmentSize
text editor box.JPG 34.39 KB

#20

Posted by ChristophWeber on August 26, 2008 at 11:06pm

@Pok:
Except that under Drupal 6.3 and 6.4 this doesn't seem to work anymore. Arrgh!
I have a test site under Drupal 6.2 where the FCKeditor fix works great, another site under 6.3 and otherwise nearly identical setup looks horrible with text aligned outside (to the left of) the FCKeditor text area.
Does anybody know what happened?

For what it's worth I am also seeing font size issues under Drupal 6.3 where 6.2 worked quite nicely. Basically, lists render as 16 pt text, not as 12 or so I saw under Drupal 6.2.

#21

Posted by Lioz on December 14, 2010 at 2:33pm
Status:active» closed (won't fix)
nobody click here