Support forums » Products » Cute Editor for .NET » Re: Height issue with Chrome, different browsers showing different results

Height issue with Chrome, different browsers showing different results

Last post 09-12-2011, 7:49 AM by Kenneth. 5 replies.
Sort Posts: Previous Next

  •  09-06-2011, 12:44 PM 69967

    Height issue with Chrome, different browsers showing different results

    Reply Quote
    This worked prior to moving to 6.6 ...
    In my HTML I create an instance if the editor with the height declared as 7 em:

    <CE:Editor id="Editor1" AutoConfigure="Simple" runat="server" Height="7em" ></CE:Editor><br />

    In Chrome there is no text area, just the header and footer bars.  When i do an Inspect Element on the ediort the height is 7px.
    <table cellspacing="0" cellpadding="0" _iscuteeditor="True" id="CE_Editor1_ID" style="background-color: rgb(244, 244, 243); border-top-color: rgb(221, 221, 221); border-right-color: rgb(221, 221, 221); border-bottom-color: rgb(221, 221, 221); border-left-color: rgb(221, 221, 221); border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; height: 7px; width: 780px; ">
     
    In Firefox the editor looks a little small, only 3 lines of text fit in the editor window, and the height is 112 px:
    <table id="CE_Editor1_ID" cellspacing="0" cellpadding="0" style="background-color: rgb(244, 244, 243); border-color: rgb(221, 221, 221); border-width: 1px; border-style: solid; height: 112px; width: 780px;" _iscuteeditor="True">
     
    in IE, the editor window is much larger, 6 lines of text fit into the text area, and the height is defined as 7em:
    <table cellspacing="0" cellpadding="0" _IsCuteEditor="True" id="CE_Editor1_ID" style="background-color:#F4F4F3;border-color:#DDDDDD;border-width:1px;border-style:Solid;height:7em;width:780px;">
    Why is this not consistant?
     

  •  09-07-2011, 8:27 AM 69978 in reply to 69967

    Re: Height issue with Chrome, different browsers showing different results

    Reply Quote
    Hi ceblanda,
     
    The Height property mean the whole editor height, not just the textarea height.
     
    You can try  <CE:Editor id="Editor1" AutoConfigure="Simple" runat="server" Height="300em" ></CE:Editor>
     
    Regards,
     
    Ken

  •  09-07-2011, 9:09 AM 69980 in reply to 69978

    Re: Height issue with Chrome, different browsers showing different results

    Reply Quote
    Hi Ken,
     
    I don't think you understand the issue.
     
    1em = the size of the parent object's font.  In most browsers it is defaulted to 16, although this can be changed by user preference on the browser or within the program itself. 
     
    So if I set height="300em", in IE and firefox it is going to give me an editor that is about 4800px tall, which is not acceptable.
     
    The issue as I see it is the latest version of CE doesn't convert properly from em to px.
     
    If I go back to the version dated 10/14/2010 and run the same text in Chrome, it does convert the em to px properly:

    <    CE:Editor id="Editor1" AutoConfigure="Simple" runat="server" Height="7em" ></CE:Editor><br />

    <table cellspacing="0" cellpadding="0" _iscuteeditor="True" id="CE_Editor1_ID" style="background-color: rgb(244, 244, 243); border-top-color: rgb(221, 221, 221); border-right-color: rgb(221, 221, 221); border-bottom-color: rgb(221, 221, 221); border-left-color: rgb(221, 221, 221); border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; width: 780px; height: 112px; ">
     
    With the latest it doesn't.
     
    <table cellspacing="0" cellpadding="0" _iscuteeditor="True" id="CE_Editor1_ID" style="background-color: rgb(244, 244, 243); border-top-color: rgb(221, 221, 221); border-right-color: rgb(221, 221, 221); border-bottom-color: rgb(221, 221, 221); border-left-color: rgb(221, 221, 221); border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; height: 7px; width: 780px; ">

  •  09-09-2011, 7:47 AM 70000 in reply to 69980

    Re: Height issue with Chrome, different browsers showing different results

    Reply Quote
    Hi ceblanda,
     
    300em just an example to shows you the setting work, you do not need to set it to 300 em.
     
    Please try the code below
     
    <%@ Page Language="C#" ValidateRequest="false" %>

    <%@ Register TagPrefix="CE" Namespace="CuteEditor" Assembly="CuteEditor" %>
    <html>
    <head>
        <title>example</title>
    </head>

    <body>
        <form id="Form1" runat="server">
            <CE:Editor ID="Editor1" runat="server" Height="15em">
            </CE:Editor>
            <div style="height: 15em; border: solid 1px red; width:400px">
                test</div>
            <br />
        </form>
    </body>
    </html>
     
    It will look like
     
     
    Regards,
     
    Ken

  •  09-12-2011, 6:48 AM 70011 in reply to 70000

    Re: Height issue with Chrome, different browsers showing different results

    Reply Quote
    Ken,
     
    That is NOT how it looks in Chrome, which is the problem.  If I run that code in Chrome there is no text area to type into.  The height of the CuteEditor area is 15PX, but the height of the red text box is 15EM, which is actually 240px.
     
    --Christy
     
     
     

  •  09-12-2011, 7:49 AM 70013 in reply to 70011

    Re: Height issue with Chrome, different browsers showing different results

    Reply Quote
    Hi ceblanda,
     
    We are investigating this issue, once issue is resloved, I will keep you posted. Sorry for your inconvenience.
     
    Regards,
     
    Ken
View as RSS news feed in XML