Search code examples
htmlcsswysiwygexpressionengineword-wrap

WYGWAM text editor overwrites CSS settings in ExpressionEngine


How do I stop WYGWAM (a WYSIWYG editor plug-in) in ExpressionEngine from overriding the css settings that I have in place? I know that some of them don't get overridden because the text is the correct color.

enter image description here

However, I set the width of the left column which contains the div that contains the WYGWAM entry, and the text WON'T WRAP.

ALSO, what is the difference between CKEditor and WYGWAM?

Just a lowly intern... Thanks so much!

Update:

<div id="leftColumn">       
    <div id="landingBodyCopy" class="landingBodyCopyText">
        {landing_body_copy}
    </div>
    <br>

    <div id="graphicLinks">
        {embed="in-store-analytics/retail-analytic" quote="{quote}"}
    </div>
</div>

And the css:

#leftColumn{
    float:left;
    width: 400px;
    bottom: -50px;
    height: 600px;
 }
 #landingBodyCopy {
    width: 400px;
    height: 500px;
 }

Solution

  • If you want to keep your text from overflowing its containing div, you either need to allow the div to expand with its contents, or prevent the extra text from being displayed. Depending on which one makes sense for your situation, you need to either remove the height: 600px and height: 500px from your css, or add overflow: hidden to the #landingBodyCopy rule.