Inconsistent behaviour in IE and Chrome

2 posts, 0 answers
  1. Ivan
    Ivan avatar
    16 posts
    Member since:
    Oct 2011

    Posted 24 May 2013 Link to this post

    Hello,
    I have 2 scenarios.
    First:
    1. Open Sitecore Content Editor in "Internet Explorer".
    2. Navigate to an item with an empty rich text field and click on 'Show Editor'.
    3. Select Html view, select All and delete the contents.
    4. Select Design view.
    5. Press 'Enter' only once.
    6. Go back to Html view.
    7. The html markup produced is as below:
    <p> </p>
    <p> </p>

    8. Repeat the above steps in Chrome.
    9. The html markup produced is as below:
    <br />
    <p><br /></p>

    Second:
    1. Paste the following markup in a Rich Text Editor's Html view:
    <div style="width: 100%;">ABC</div>
    <div style="width: 100%;">DEF</div>
    2. Go back to design view.
    3. In "Internet Explorer" the above 'div's can be selected, dragged and dropped.
    4. In Chrome they are not selectable.

    Why does the editor behaves differently in IE and Chrome? Can this be fixed?

  2. Slav
    Admin
    Slav avatar
    1359 posts

    Posted 29 May 2013 Link to this post

    Hello Ivan,

    The <br /> tag inside the inserted paragraph is needed, otherwise the WebKit browsers will not render the empty paragraph. This behavior is discussed in the linked help article.

    As for your second case, the selected content has layout which means that there are borders over it and you should double click on it in IE to be able to edit it. The CSS properties which cause hasLayout are listed below:

    CSS property Value
    display inline-block
    height any value
    float left or right
    position absolute
    width any value
    -ms-writing-mode tb-rl
    zoom any value

    If at least one of the above properties is set to an HTML element, it will cause it to have a layout and to edit it the user should double click on it and the resize handlers along with a border will appear. The hasLayout is an IE feature that cannot be disabled. It is also not supported by the other browsers. You can find more information about this browser functionality in the following MSDN article: http://msdn.microsoft.com/en-us/library/ms533776%28VS.85%29.aspx. You will experience this behavior in all DHTML based competitors' editors as well as in the standard editable IFRAME / DIV elements.

    Regards,
    Slav
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top