Content hieght issues (Firefox MAC)

[ataya]

I'm having an issue with Editor content area height with firefox..
this is what I got:
<telerik:RadEditor runat="server" ID="trdEmailFooter" Width="600px" Height="100"
                        EditModes="Design" ToolbarMode="ShowOnFocus" EnableResize="true" AutoResizeHeight="True"
                        BorderStyle="None" ToolsWidth="315px" Skin="Telerik" OnTextChanged="trdEmailFooter_TextChanged"
                        AllowScripts="true">
                        <Content>
</Content>
                        <Tools>
                            <telerik:EditorToolGroup>
                                <telerik:EditorTool Name="Bold" />
                                <telerik:EditorTool Name="Italic" />
                                <telerik:EditorTool Name="Underline" />
                                <telerik:EditorSeparator />
                                <telerik:EditorTool Name="ForeColor" />
                                <telerik:EditorTool Name="BackColor" />
                                <telerik:EditorSeparator />
                                <telerik:EditorTool Name="FontName" />
                                <telerik:EditorTool Name="FontSize" />
                            </telerik:EditorToolGroup>
                        </Tools>
                    </telerik:RadEditor>

ISSUES:

1- On Firefox (widows and mac) the content area is shorter the it's set.. when I do a postback (ajax) the content box fits okay
2- On Firefox (only mac) when a partial post back is done (ajax) when I do focus I don't see the toolbar anymore (when I sat the toolbarmode="default") I can see toolbar but can't change font style..

please help

[Rumen]

Hi Mark,

The Height problem is due to a well known issue / bug in the Mozilla browser, and not to the editor. The browser itself ignores setting any heights smaller than 150px to the IFRAME element.

Here is a small sample that shows the root of the problem:

<table style="height:80px;border:3px solid green">
    <tr style="height:100%">
        <td style="height:100%">
            <iframe style="border: 1px solid red; height:100%" src=""></iframe>
        </td>
    </tr>
</table>

As you can see, there is no r.a.d.editor here. Just a simple table with an iFrame in it. Check how it will look like under IE and Firefox.

The good news is that you can fix this browser problem by using the RadEditor's Client-Side API. The following code will show you how to set the editor Height to 50 px in IE and Firefox:

<asp:UpdatePanel ID="UP1" runat="server">
    <ContentTemplate>
    <br /><br /><br />
    <script type="text/javascript">
    function SetCorrectSize(editor, args)
    {
        window.setTimeout(function()
            {
                var editorIframe = $get("RadEditor1Wrapper").getElementsByTagName("iframe")[0];
                editorIframe.style.height = "50px";
                editor.setSize(600, 50);
           },100);
    }
    </script>
    <telerik:RadEditor ID="RadEditor1" Width="600px" Height="50px" OnClientLoad="SetCorrectSize" runat="server"  ToolbarMode="ShowOnFocus" EnableResize="true" AutoResizeHeight="True"
        BorderStyle="None" ToolsWidth="315px" Skin="Telerik" >
      <Tools>
        <telerik:EditorToolGroup>
            <telerik:EditorTool Name="Bold" />
            <telerik:EditorTool Name="Italic" />
            <telerik:EditorTool Name="Underline" />
            <telerik:EditorSeparator />
            <telerik:EditorTool Name="ForeColor" />
            <telerik:EditorTool Name="BackColor" />
            <telerik:EditorSeparator />
            <telerik:EditorTool Name="FontName" />
            <telerik:EditorTool Name="FontSize" />
        </telerik:EditorToolGroup>
      </Tools>
      <Modules>
        <telerik:EditorModule Name="fakeModule"/>
      </Modules>
    </telerik:RadEditor>
    <br /><br /><br />
    <asp:Button ID="Button1" UseSubmitBehavior="false" runat="server" Text="Submit Button" />

    </ContentTemplate>
</asp:UpdatePanel>

I was not able to reproduce the second problem on my side and attached here a video demonstrating my test. Please, also test my sample project here.

Greetings,
Rumen
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[ataya]

Rumen, 

thank you for your replay .. that really helped and thanks for the video that is very very smart!!