cute editor's height property problem!

Last post 08-10-2008, 1:33 AM by zmw85. 2 replies.
Sort Posts: Previous Next
  •  08-09-2008, 8:35 PM 42867

    cute editor's height property problem!

    Hi,
    I have a problem here I have spent hours with!
     
    the page has a cute editor placed in a 'lightbox' (customized div has a absolute position with display set to none or block). the problem comes when I switch the lightbox on to display the cute editor, the light box always stay 0 height. picture here:
     
     
     
    I have tried different height values and different resize mode, but the problem stays. 
     
    The code for this light box:
     
     <div id="SendMessageLightBox" class="lightBox" style="width:620px; margin-left:-316px; height:450px;">
        <div class="inner" style="vertical-align:middle; width:610px; margin-left:-310px; margin-top:-225px; height:440px;">
            <a class="close" onclick="lightBoxSwitcher('SendMessageLightBox', '');maskSwitch();" title="close window">&nbsp;X&nbsp;</a>
            <div>
                <table style="width:100%;">
                    <tr>
                        <td style="width:40px" class="alignRight">
                            <asp:Label ID="Label1" runat="server" Text="To: " SkinID="boldLabel"></asp:Label></td>
                        <td><asp:TextBox ID="txtTo" runat="server" ReadOnly="True" Width="70%"></asp:TextBox></td>
                    </tr>
                    <tr>
                        <td class="alignRight">
                            <asp:Label ID="Label2" runat="server" Text="Subject: " SkinID="boldLabel"></asp:Label>
                        </td>
                        <td>
                            <asp:TextBox ID="txtSubject" runat="server" Width="70%"></asp:TextBox>
                            <asp:RequiredFieldValidator ID="valSubject" ControlToValidate="txtSubject" ValidationGroup="Msg" runat="server" ErrorMessage="Subject Required!"></asp:RequiredFieldValidator>
                        </td>
                    </tr>
                    <tr>
                        <td class="alignRight" style="vertical-align:top">
                            <asp:Label ID="Label3" runat="server" Text="Mesage: " SkinID="boldLabel"></asp:Label>
                        </td>
                        <td>
                            <CE:Editor ID="txtComment" runat="server"
                                ConfigurationPath="~/CuteSoft_Client/CuteEditor/Configuration/MyTool.config" Width="100%"
                                Height="250px" EnableStripStyleTagsCodeInjection="false" onKeyUp="JsFilter(this)">
                                <FrameStyle BackColor="White" BorderColor="#DDDDDD" BorderStyle="Solid" BorderWidth="1px" CssClass="" Height="99%" Width="99%" />
                            </CE:Editor>
                            <%--<asp:TextBox ID="txtComment" runat="server" Height="150px" Width="400px" TextMode="MultiLine" onKeyUp="JsFilter(this)"></asp:TextBox>--%>
                        </td>
                    </tr>
                    <tr>
                        <td class="alignRight"></td>
                        <td>
                            <Ajax:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
                                <ContentTemplate>
                                    <asp:Button ID="btnPost" runat="server" Text="Send" onclick="btnPost_Click" ValidationGroup="Msg" />
                                    <input id="btnCancel" type="button" value="Cancel" onclick="lightBoxSwitcher('SendMessageLightBox', ''); maskSwitch();" class="BtnOFF" onmouseover="this.className='BtnON';" onmouseout="this.className='BtnOFF';" />
                                </ContentTemplate>
                                <Triggers>
                                    <Ajax:AsyncPostBackTrigger ControlID="btnPost" />
                                </Triggers>
                            </Ajax:UpdatePanel>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
     
     the css for 'lightbox' is:
     
    .lightBox
    {
        position:absolute;
        width:410px;
        height:210px;  
        padding:5px;
        left:50%;
        margin-left:-211px;
        background:#24a635;
        border:1px solid black;
        z-index:10001;  
        display:none;
    }

     Any one get any idea with this problem???

  •  08-10-2008, 1:19 AM 42869 in reply to 42867

    Re: cute editor's height property problem!

    If you set the height of the Editor to 500 instead of 99%, will it help?

    asp.net Chat http://cutesoft.net/ASP.NET+Chat/default.aspx
    Web Messenger: http://cutesoft.net/Web-Messenger/default.aspx
    asp.net wysiwyg editor: http://cutesoft.net/ASP.NET+WYSIWYG+Editor/default.aspx
    asp wysiwyg html editor: http://cutesoft.net/ASP
    asp.net Image Gallery: http://cutesoft.net/ASP.NET+Image+Gallery/default.aspx
    Live Support: http://cutesoft.net/live-support/default.aspx

  •  08-10-2008, 1:33 AM 42871 in reply to 42869

    Re: cute editor's height property problem!

    doesn't help,
     
    forget to tell that that No problem at all on IE7, only on firefox!

    it also works by setting resizemode to  "autoajust" under firefox, but the scoll bar of lightbox will show when users typing many lines.
View as RSS news feed in XML