Textarea Inner Margins

[jrottman]

I am successfully implemented tinyMCE with in a flex based application, this editor is absolutely fantastic when working with flex. I however have run into two issues that I am a bit lost on.

The primary issue that I am currently working on is setting margin spacing with in the textarea. Right now, what I am trying to achieve is a 1.5em space with in the text area so that the text does not touch the other container walls of the textarea.. This is to simulate the basic margin functionality that one would get with in a standard text editor. I have combed google and found a few things that I have tried, but all came up as naught.

I have set the margin attribute on the mceEditorArea css style name to margin: 1.5em 1.5em 1.5em 1.5em; but this didn't do anything for me.

Any know how I can achieve the functionality what I am looking for? I know this is a css issue that I am facing, I am just not sure how to fix it.

Here is my current code.

Complete mceEditorArea
.mceEditorArea { font-family: 'MS Sans Serif', sans-serif, Verdana, Arial; background: #FFFFFF; padding: 0; margin: 1.5em 1.5em 1.5em 1.5em; }

Text Area
<textarea id="elm1" name="elm1" style="width:100%;">
</textarea>

 

[Vragabond]

You will need to find a class called mceContentBody. Adding padding or margin to this element I think will do what you want. But beware ... rich context editors work in a way that they replace the textarea with an iframe where you are then editing the rich content. So you will have to define the correct css in the stylesheet that is loaded in the iframe.

___________________________________________________________
[small]Do something about world cancer today: PACT[/small]

 

[traingamer]

What actually assigns the mceEditorArea class to the textarea?

Unless I am missing something (always possible), you need to either add the textarea id to the css like so:

.mceEditorArea[b],#elm1[/b]  { font-family: 'MS Sans Serif', sans-serif, Verdana, Arial; background: #FFFFFF; padding: 0; margin: 1.5em 1.5em 1.5em 1.5em; }

OR add the style to the html like:

    <textarea id="elm1" name="elm1" style="width:100%;" [b]class="mceEditorArea"[/b]>
    </textarea>

Greg
"Personally, I am always ready to learn, although I do not always like being taught." - Winston Churchill