[SOLVED] Micro Tiny Dark Background & Dark Text

[forextrader36]

Hi

I have done a clean install of cmsms 1.10.3 and installed a theme I like.

The Micro Tiny text editor has a dark background colour and also dark text which makes it impossible to read.

How can I change this?

[Jo Morg]

You can always Search...

Look what I found .....

[forextrader36]

Yes, I did search and read that same post you found but it doesn't make any sense to me.

I was hoping somebody might be able to explain it in more detail.

It talks about setting body, and text colour but it doesn't say where to do it or how to do it. It mentions a template but doesn't say which one and it mentions #pagewrapper which I don't know what the relevance of that is.

So..........

I have done a clean install of cmsms 1.10.3 and installed a theme I like.

The Micro Tiny text editor has a dark background colour and also dark text which makes it impossible to read.

How can I change this?

[Dr.CSS]

In the default templates there is...

</__body>
<div id="pagewrapper"> This page wrapper is the first div that wraps the whole page...

In the style sheet attached to the page template...

body {
margin: 1em;
color: #333; change to black/#000
background-color: #CCC; change to white/#FFF
}
div#pagewrapper {
width: 960px;
margin: 0 auto;
color: black;
background-color: #FFF;
border: 1px solid black;
}

This is where you would change the body background and text color to make it so tiny/MT editing shows a white background with a dark/black text

[forextrader36]

What do you mean by the 'Default Template'?

I can't remember which template was set as default when I first installed cmsms, the default template now is the one from the theme I have installed.

I don't want to change the background colour of my website too?

[Dr.CSS]

Meaning one of the "default templates" installed on first setting up a CMSMS site...

This was just an example you may need to change some of the words to suit your case...

A link to the page/site might help...

[forextrader36]

Ok, the site is http://www.justmenstrousers.co.uk/

[Dr.CSS]

For that template I would put one more div around the <div id="wrapper"> and put the body background: #002236 url(/uploads/elegantblue/img01.gif) repeat-x; and color: #181B20; in/on it...

Like <div id='pagewrap'>
Then...

#pagewrap {
margin: 0;
padding: 0;
background: #002236 url(/uploads/elegantblue/img01.gif) repeat-x;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #181B20;
}

Then the body can be...

body {
background: #FFF;
color: #000;
}

[forextrader36]

Ok I did what you said which did fix the MicroTiny background issue but then I had a white border all around the edge of my website.

I figured out that I could just add in the margin and padding to the code provided above to make it:

body {
margin: 0;
padding: 0;
background: #FFF;
color: #000;
}

I'm not sure if that is the right thing to do but it did get rid of most of the white border but there is still a white section right at the bottom of the page?

[Dr.CSS]

You have a 40px margin at the bottom of the footer which pushes it away from the bottom of the browser window...

[kendo451]

There is a Simple solution that does not require changing your template:

How to set MicroTiny background and font color

[forextrader36]

Thanks Dr.CSS & kendo451 for your suggestions.