Zen Node-Browser Prototype

This is a <nav> element with its float property set to "left".

This is more text. Notice that it does not fill up an inline or block element, so it has no element to outline in red.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

In the node-browser mode of Zen, every node that it is possible to outline will be outlined so the structure of the page can be better visualized.

Here is a paragraph. This paragraph contains some inline elements—an image and a span.This is a span.

Here is another paragraph.

This is the last paragraph in the first <article> element.

TODO

It is easy for a user to miss the fact that the <hr> element above can be selected by the mouse because it does not have much height. Any element with a small computed value for its height will present the same difficulty. It might be a good idea to set a minimum height of about 5 or 10 pixels to every element.