Problem with inserting 1 line break in a paragraph. If 2 line breaks, it works.

[Ema]

Hi Telerik,

I have a problem with inserting one line break within the paragraph because it did not render as line break <br/>. If I enter 2 line breaks, that is the time it renders <br/>  within the <p> tags.

Please see below for more elaboration:

Below is my telerik radeditor code in markup page (.aspx):

<telerik:RadEditor ID="uscEditor" runat="server" Width="650" ToolsFile="~/EditMailTemplateTools.xml"
                        ContentAreaMode="Div" EditModes="Design" ExternalDialogsPath="~/Controls" DialogHandlerUrl="~/Telerik.Web.UI.DialogHandler.axd"
                        LocalizationPath="~/Resources/RadEditor Dialog" ContentFilters="RemoveScripts, ConvertToXhtml, FixEnclosingP">
                        <CssFiles>
                            <telerik:EditorCssFile Value="../../Includes/Styles/EditorStyle.css" />
                        </CssFiles>
                        <ContextMenus>
                            <telerik:EditorContextMenu TagName="A" Enabled="false">
                            </telerik:EditorContextMenu>
                            <telerik:EditorContextMenu TagName="*">
                                <telerik:EditorTool Name="Cut" />
                                <telerik:EditorTool Name="Copy" />
                                <telerik:EditorTool Name="Paste" />
                            </telerik:EditorContextMenu>
                        </ContextMenus>
                    </telerik:RadEditor>

My EditorStyle.css is this:

.reContentArea  /*this selector corresponds to the body selector when RadEditor is in Iframe mode*/
{
    font-family: Verdana !important;
    font-size: 12px !important;
    color: white;
    background-color: #555 !important;
    text-align: left !important;
    word-wrap: break-word !important;
    padding: 3px 15px 3px 15px !important;
}

.reContentArea P
{
    margin: 0;
    border: 1px solid #666;
    color: #666;
    font-size: 12px;
    padding: 10px;
}

.reContentArea H1
{
    margin: 0;
    border: 1px solid #666;
    color: #000;
    padding: 20px;
}

.reContentArea OL
{
    margin-top: 20px;
    list-style-type: lower-roman;
    border: 1px solid #666;
    color: #555;
    padding: 10px 10px 10px 55px;
}

.reContentArea table
{
  BORDER-RIGHT: #99ff99 1px dashed;
  BORDER-BOTTOM: #99ff99 1px dashed;
  width:100%;
  margin-top: 20px;
}

.reContentArea table td
{
  font-size: 12px !important;
  color: #555;
  PADDING: 3px;
  BORDER-TOP: #99ff99 1px dashed;
  BORDER-LEFT: #99ff99 1px dashed;
  text-align: center;
}

.reContentArea img
{
    margin: 1px 1px 1px 1px;
    border: solid 1px blue;
}

so this is the content of the editor being set on page load:

<p><span class="param">[asdadsd]</span><br /><br /></p><p>asdsadaddasd d sffdsfdsfsf, wuweqiwqeiwuicxen period</p><p>Best regards,<br />sadasdasd</p><p>dasadsadsad qwweuic xnnnsansansawqwqi.</p>

Then, I decided to modify the message and click save (see below)

So what I did was I am going to enter line break between the word 'period' and 'Best regards'. So I positioned my cursor at the end of word 'period' and press enter. In the UI, it did show a line break. But after saving it, there is no line break anymore because the html output of the content of the editor is this (which is still the same) :

editor.Content :

<p><span class="param">[asdadsd]</span><br /><br /></p><p>asdsadaddasd d sffdsfdsfsf, wuweqiwqeiwuicxen period</p><p>Best regards,<br />sadasdasd</p><p>dasadsadsad qwweuic xnnnsansansawqwqi.</p>

Even if I position my cursor before the letter B in Best Regards and hit enter, it still does not work.

If I enter 2 line breaks, that is the time it renders <br/>  within the <p> tags.
editor.Content becomes this:

<p><span class="param">[asdadsd]</span><br /><br /></p><p>asdsadaddasd d sffdsfdsfsf, wuweqiwqeiwuicxen period<br /><br /></p><p>Best regards,<br />sadasdasd</p><p>dasadsadsad qwweuic xnnnsansansawqwqi.</p>

Can you help me with this? What should I do to make it work (entering one line break and it will be as such)?

Thank you!

Best Regards,
Ema

[Ema]

By the way, I am using Telerik version v4.0.30319
My browser is IE9

[Ema]

Telerik Runtime version - v4.0.30319

Telerik Version - 2011.2.712.40

[Marin Bratanov]

Hi Ema,

Some browsers add unnecessary <br> tags at the end of paragraphs which is why there is a filter in RadEditor that strips such rogue elements. In most cases they are unwanted and not created by the user.
In your case you would need to disable this filter:

function removeFilters(sender, args) {
    sender.get_filtersManager().removeFilterByName("RemoveExtraBrakes");
}

<telerik:RadEditor ID="uscEditor" runat="server" OnClientLoad="removeFilters">
 . . . .
</telerik:RadEditor>

I am attaching here a small sample and a video from the behavior on my end as a reference.
I would also advise upgrading your RadControls because your version is more than two and a half years old, and there are many fixes and improvements introduced since then. Also, support for the modern browsers is available in the latest version.

Regards,
Marin Bratanov
Telerik