Home/ Questions/Q 8154927
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-06T16:30:52+00:00

I’m playing around with the html5 contentEditable=true feature. The best example therefor is here

  • 0

I’m playing around with the html5 contentEditable="true" feature. The best example therefor is here HTML5 Demo: ContentEditable. Now this features works best in IE 9.0 (shocking, something works best in IE ;)), and there it displayes this cool resize boxes over all HTML elements (which is quite funny because now you can’t click the button or any link^^ (well talk about wokring best…)).

I copied the demo and boiled it down to the content ediable part, but I can’t find how they make this resize boxes for the elements. What am I missing?

Here is my code simple html: 

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset=utf-8>
        <title>HTML5 Demo: ContentEditable</title>
    </head>
    <body>
        <section contenteditable="true">
            <h2>Go ahead, edit away!</h2>
            <p>
                Here's a typical paragraph element
            </p>
            <ol>
                <li>
                    and now a list
                </li>
            </ol>
        </section>
    </body>
</html>

Source: HTML5 Demo: ContentEditable

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Mozilla also has similar resize handles for tables and images. WebKit and Opera have no built-in resizing UI for editable content. IE goes further and also provides resize handles for all elements that have layout. IE also has a different type of selection object to deal with editable elements being in this mode.

    • 0