diff --git a/lib/editor/atto/styles.css b/lib/editor/atto/styles.css
index 6511ee9f515..2acc6590b5d 100644
--- a/lib/editor/atto/styles.css
+++ b/lib/editor/atto/styles.css
@@ -1,24 +1,29 @@
-div.editor_atto {
+.editor_atto_content_wrap {
     background-color: white;
-    border: 1px solid #BBB;
-    width: 100%;
+}
+.editor_atto_content {
+    padding: 4px;
 }
 
+.editor_atto_content_wrap,
 .editor_atto + textarea {
     width: 100%;
     padding: 0;
-    resize: vertical;
-    border-radius: 0;
     border: 1px solid #BBB;
+    border-top: none;
+}
+
+.editor_atto + textarea {
+    border-radius: 0;
+    resize: vertical;
+    margin-top: -1px;
 }
 
 div.editor_atto_toolbar {
     display: block;
     background: #F2F2F2;
     min-height: 42px;
-    border-top: 1px solid #BBB;
-    border-left: 1px solid #BBB;
-    border-right: 1px solid #BBB;
+    border: 1px solid #BBB;
     width: 100%;
     padding: 0 0 9px 0;
 }
@@ -53,7 +58,7 @@ div.editor_atto_toolbar div.atto_group {
     background: #FFF;
 }
 
-.editor_atto img {
+.editor_atto_content img {
     resize: both; overflow: auto;
 }
 
diff --git a/lib/editor/atto/yui/build/moodle-editor_atto-editor/moodle-editor_atto-editor-debug.js b/lib/editor/atto/yui/build/moodle-editor_atto-editor/moodle-editor_atto-editor-debug.js
index 96ccd495ef5..ccdc137dc2a 100644
--- a/lib/editor/atto/yui/build/moodle-editor_atto-editor/moodle-editor_atto-editor-debug.js
+++ b/lib/editor/atto/yui/build/moodle-editor_atto-editor/moodle-editor_atto-editor-debug.js
@@ -15,15 +15,34 @@ YUI.add('moodle-editor_atto-editor', function (Y, NAME) {
 // You should have received a copy of the GNU General Public License
 // along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
 
+/**
+ * Atto editor.
+ *
+ * @package    editor_atto
+ * @copyright  2013 Damyon Wiese  <damyon@moodle.com>
+ * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+
+/**
+ * Classes constants.
+ */
+CSS = {
+    CONTENT: 'editor_atto_content',
+    CONTENTWRAPPER: 'editor_atto_content_wrap',
+    TOOLBAR: 'editor_atto_toolbar',
+    WRAPPER: 'editor_atto'
+};
+
 /**
  * Atto editor main class.
  * Common functions required by editor plugins.
  *
- * @package    editor-atto
+ * @package    editor_atto
  * @copyright  2013 Damyon Wiese  <damyon@moodle.com>
  * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
  */
 M.editor_atto = M.editor_atto || {
+
     /**
      * List of attached button handlers to prevent duplicates.
      */
@@ -309,12 +328,22 @@ M.editor_atto = M.editor_atto || {
      */
     init : function(params) {
         var textarea = Y.one('#' +params.elementid);
+        var wrapper = Y.Node.create('<div class="' + CSS.WRAPPER + '" />');
         var atto = Y.Node.create('<div id="' + params.elementid + 'editable" ' +
                                             'contenteditable="true" ' +
                                             'spellcheck="true" ' +
-                                            'class="editor_atto"/>');
+                                            'class="' + CSS.CONTENT + '" />');
+
         var cssfont = '';
-        var toolbar = Y.Node.create('<div class="editor_atto_toolbar" id="' + params.elementid + '_toolbar" role="toolbar"/>');
+        var toolbar = Y.Node.create('<div class="' + CSS.TOOLBAR + '" id="' + params.elementid + '_toolbar" role="toolbar"/>');
+
+        // Editable content wrapper.
+        var content = Y.Node.create('<div class="' + CSS.CONTENTWRAPPER + '" />');
+        content.appendChild(atto);
+
+        // Add everything to the wrapper.
+        wrapper.appendChild(toolbar);
+        wrapper.appendChild(content);
 
         // Bleh - why are we sent a url and not the css to apply directly?
         var css = Y.io(params.content_css, { sync: true });
@@ -328,10 +357,8 @@ M.editor_atto = M.editor_atto || {
         // Copy text to editable div.
         atto.append(textarea.get('value'));
 
-        // Add the toolbar to the page.
-        textarea.get('parentNode').insert(toolbar, textarea);
-        // Add the editable div to the page.
-        textarea.get('parentNode').insert(atto, textarea);
+        // Add the toolbar and editable zone to the page.
+        textarea.get('parentNode').insert(wrapper, textarea);
         atto.setStyle('color', textarea.getStyle('color'));
         atto.setStyle('lineHeight', textarea.getStyle('lineHeight'));
         atto.setStyle('fontSize', textarea.getStyle('fontSize'));
diff --git a/lib/editor/atto/yui/build/moodle-editor_atto-editor/moodle-editor_atto-editor-min.js b/lib/editor/atto/yui/build/moodle-editor_atto-editor/moodle-editor_atto-editor-min.js
index 21a2acec687..6bf193f3e92 100644
--- a/lib/editor/atto/yui/build/moodle-editor_atto-editor/moodle-editor_atto-editor-min.js
+++ b/lib/editor/atto/yui/build/moodle-editor_atto-editor/moodle-editor_atto-editor-min.js
@@ -1,2 +1,2 @@
-YUI.add("moodle-editor_atto-editor",function(e,t){M.editor_atto=M.editor_atto||{buttonhandlers:{},menus:{},menuhandlers:{},filepickeroptions:{},widgets:{},showhide_menu_handler:function(e){e.preventDefault();var t=this.getAttribute("disabled"),n=this.getAttribute("data-menu"),r=M.editor_atto.menus[n],i=r.get("bodyContent");r.get("visible")||t?(r.hide(),i.detach("clickoutside")):(i.on("clickoutside",function(e){e.target.ancestor()!==this&&e.target!==this&&r.get("visible")&&(i.detach("clickoutside"),r.hide())},this),r.show())},buttonclicked_handler:function(e){var t=this.getAttribute("data-editor"),n=this.getAttribute("data-plugin"),r=this.getAttribute("data-handler"),i=M.editor_atto.menus[n+"_"+t];i&&i.hide();if(M.editor_atto.is_enabled(t,n))return r=M.editor_atto.buttonhandlers[r],r(e,t)},is_enabled:function(t,n){var r=e.one("#"+t+"_toolbar .atto_"+n+"_button");return!r.hasAttribute("disabled")},disable_all_widgets:function(t){var n,r;for(n in M.editor_atto.widgets)r=e.one("#"+t+"_toolbar .atto_"+n+"_button"),r&&r.setAttribute("disabled","true")},enable_widget:function(t,n){var r=e.one("#"+t+"_toolbar .atto_"+n+"_button");r&&r.removeAttribute("disabled")},enable_all_widgets:function(t){var n,r;for(n in M.editor_atto.widgets)r=e.one("#"+t+"_toolbar .atto_"+n+"_button"),r&&r.removeAttribute("disabled")},add_toolbar_menu:function(t,n,r,i,s){var o=e.one("#"+t+"_toolbar"),u=e.one("#"+t+"_toolbar .atto_group."+i+"_group"),a,f;u||(u=e.Node.create('<div class="atto_group '+i+'_group"></div>'),o.append(u)),f=e.Node.create('<button class="atto_'+n+'_button atto_hasmenu" '+'data-editor="'+e.Escape.html(t)+'" '+'tabindex="-1" '+'data-menu="'+n+"_"+t+'" >'+r+"</button>"),u.append(f),a=o.getAttribute("aria-activedescendant"),a||(f.setAttribute("tabindex","0"),o.setAttribute("aria-activedescendant",f.generateID())),M.editor_atto.widgets[n]=n;var l=e.Node.create('<div class="atto_'+n+"_menu"+' atto_menu" data-editor="'+e.Escape.html(t)+'"></div>'),c=0,h={};for(c=0;c<s.length;c++)h=s[c],l.append(e.Node.create('<div class="atto_menuentry"><a href="#" class="atto_'+n+"_action_"+c+'" '+'data-editor="'+e.Escape.html(t)+'" '+'data-plugin="'+e.Escape.html(n)+'" '+'data-handler="'+e.Escape.html(n+"_action_"+c)+'">'+h.text+"</a>"+"</div>")),M.editor_atto.buttonhandlers[n+"_action_"+c]||(e.one("body").delegate("click",M.editor_atto.buttonclicked_handler,".atto_"+n+"_action_"+c),M.editor_atto.buttonhandlers[n+"_action_"+c]=h.handler);M.editor_atto.buttonhandlers[n]||(e.one("body").delegate("click",M.editor_atto.showhide_menu_handler,".atto_"+n+"_button"),M.editor_atto.buttonhandlers[n]=!0);var p=new M.core.dialogue({bodyContent:l,visible:!1,width:"14em",zindex:100,lightbox:!1,closeButton:!1,centered:!1,align:{node:f,points:[e.WidgetPositionAlign.TL,e.WidgetPositionAlign.BL]}});M.editor_atto.menus[n+"_"+t]=p,p.render(),p.hide(),p.headerNode.hide()},add_toolbar_button:function(t,n,r,i,s){var o=e.one("#"+t+"_toolbar"),u=e.one("#"+t+"_toolbar .atto_group."+i+"_group"),a,f;u||(u=e.Node.create('<div class="atto_group '+i+'_group"></div>'),o.append(u)),a=e.Node.create('<button class="atto_'+n+'_button" '+'data-editor="'+e.Escape.html(t)+'" '+'data-plugin="'+e.Escape.html(n)+'" '+'tabindex="-1" '+'data-handler="'+e.Escape.html(n)+'">'+r+"</button>"),u.append(a),f=o.getAttribute("aria-activedescendant"),f||(a.setAttribute("tabindex","0"),o.setAttribute("aria-activedescendant",a.generateID())),M.editor_atto.buttonhandlers[n]||(e.one("body").delegate("click",M.editor_atto.buttonclicked_handler,".atto_"+n+"_button"),M.editor_atto.buttonhandlers[n]=s),M.editor_atto.widgets[n]=n},is_active:function(t){var n=M.editor_atto.get_selection();n.length&&(n=n.pop());var r=null;return n.parentElement?r=e.one(n.parentElement()):r=e.one(n.startContainer),r&&r.ancestor("#"+t+"editable")!==null},focus:function(t){e.one("#"+t+"editable").focus()},init:function(t){var n=e.one("#"+t.elementid),r=e.Node.create('<div id="'+t.elementid+'editable" '+'contenteditable="true" '+'spellcheck="true" '+'class="editor_atto"/>'),i="",s=e.Node.create('<div class="editor_atto_toolbar" id="'+t.elementid+'_toolbar" role="toolbar"/>'),o=e.io(t.content_css,{sync:!0}),u=o.responseText.indexOf("font:");u&&(i=o.responseText.substring(u+"font:".length,o.responseText.length-1),r.setStyle("font",i)),r.setStyle("minHeight",1.2*(n.getAttribute("rows")-1)+"em"),r.append(n.get("value")),n.get("parentNode").insert(s,n),n.get("parentNode").insert(r,n),r.setStyle("color",n.getStyle("color")),r.setStyle("lineHeight",n.getStyle("lineHeight")),r.setStyle("fontSize",n.getStyle("fontSize")),n.hide(),r.on("blur",function(){n.set("value",r.getHTML())}),e.one(e.config.doc.body).delegate("key",this.keyboard_navigation,"down:37,39","#"+t.elementid+"_toolbar",this,t.elementid),M.editor_atto.filepickeroptions[t.elementid]=t.filepickeroptions},keyboard_navigation:function(t,n){var r,i,s,o;t.preventDefault(),r=e.all("#"+n+"_toolbar button"),s=e.one("#"+n+"_toolbar").getAttribute("aria-activedescendant");if(!s)return;i=e.one("#"+s),i.setAttribute("tabindex","-1"),o=r.indexOf(i),t.keyCode===37?(o--,o<0&&(o=r.size()-1)):(o++,o>=r.size()&&(o=0)),i=r.item(o),i.setAttribute("tabindex","0"),i.focus(),e.one("#"+n+"_toolbar").setAttribute("aria-activedescendant",i.generateID())},show_filepicker:function(t,n,r){e.use("core_filepicker",function(e){var i=M.editor_atto.filepickeroptions[t][n];i.formcallback=r,i.editor_target=e.one(t),M.core_filepicker.show(e,i)})},get_selection_from_node:function(e){var t;return window.getSelection?(t=document.createRange(),t.setStartBefore(e.getDOMNode()),t.setEndAfter(e.getDOMNode()),[t]):document.selection?(t=document.body.createTextRange(),t.moveToElementText(e.getDOMNode()),t):!1},get_selection:function(){if(window.getSelection){var e=window.getSelection(),t=[],n=0;for(n=0;n<e.rangeCount;n++)t.push(e.getRangeAt(n));return t}return document.selection&&document.selection.createRange?document.selection.createRange():!1},get_selection_parent_node:function(){var e=M.editor_atto
-.get_selection();if(e.length>0)return e[0].commonAncestorContainer},get_selection_text:function(){var e=M.editor_atto.get_selection();if(e.length>0&&e[0].cloneContents)return e[0].cloneContents()},set_selection:function(e){var t,n;if(window.getSelection){t=window.getSelection(),t.removeAllRanges();for(n=0;n<e.length;n++)t.addRange(e[n])}else document.selection&&e.select&&e.select()}}},"@VERSION@",{requires:["node","io","overlay","escape","event-key","moodle-core-notification"]});
+YUI.add("moodle-editor_atto-editor",function(e,t){CSS={CONTENT:"editor_atto_content",CONTENTWRAPPER:"editor_atto_content_wrap",TOOLBAR:"editor_atto_toolbar",WRAPPER:"editor_atto"},M.editor_atto=M.editor_atto||{buttonhandlers:{},menus:{},menuhandlers:{},filepickeroptions:{},widgets:{},showhide_menu_handler:function(e){e.preventDefault();var t=this.getAttribute("disabled"),n=this.getAttribute("data-menu"),r=M.editor_atto.menus[n],i=r.get("bodyContent");r.get("visible")||t?(r.hide(),i.detach("clickoutside")):(i.on("clickoutside",function(e){e.target.ancestor()!==this&&e.target!==this&&r.get("visible")&&(i.detach("clickoutside"),r.hide())},this),r.show())},buttonclicked_handler:function(e){var t=this.getAttribute("data-editor"),n=this.getAttribute("data-plugin"),r=this.getAttribute("data-handler"),i=M.editor_atto.menus[n+"_"+t];i&&i.hide();if(M.editor_atto.is_enabled(t,n))return r=M.editor_atto.buttonhandlers[r],r(e,t)},is_enabled:function(t,n){var r=e.one("#"+t+"_toolbar .atto_"+n+"_button");return!r.hasAttribute("disabled")},disable_all_widgets:function(t){var n,r;for(n in M.editor_atto.widgets)r=e.one("#"+t+"_toolbar .atto_"+n+"_button"),r&&r.setAttribute("disabled","true")},enable_widget:function(t,n){var r=e.one("#"+t+"_toolbar .atto_"+n+"_button");r&&r.removeAttribute("disabled")},enable_all_widgets:function(t){var n,r;for(n in M.editor_atto.widgets)r=e.one("#"+t+"_toolbar .atto_"+n+"_button"),r&&r.removeAttribute("disabled")},add_toolbar_menu:function(t,n,r,i,s){var o=e.one("#"+t+"_toolbar"),u=e.one("#"+t+"_toolbar .atto_group."+i+"_group"),a,f;u||(u=e.Node.create('<div class="atto_group '+i+'_group"></div>'),o.append(u)),f=e.Node.create('<button class="atto_'+n+'_button atto_hasmenu" '+'data-editor="'+e.Escape.html(t)+'" '+'tabindex="-1" '+'data-menu="'+n+"_"+t+'" >'+r+"</button>"),u.append(f),a=o.getAttribute("aria-activedescendant"),a||(f.setAttribute("tabindex","0"),o.setAttribute("aria-activedescendant",f.generateID())),M.editor_atto.widgets[n]=n;var l=e.Node.create('<div class="atto_'+n+"_menu"+' atto_menu" data-editor="'+e.Escape.html(t)+'"></div>'),c=0,h={};for(c=0;c<s.length;c++)h=s[c],l.append(e.Node.create('<div class="atto_menuentry"><a href="#" class="atto_'+n+"_action_"+c+'" '+'data-editor="'+e.Escape.html(t)+'" '+'data-plugin="'+e.Escape.html(n)+'" '+'data-handler="'+e.Escape.html(n+"_action_"+c)+'">'+h.text+"</a>"+"</div>")),M.editor_atto.buttonhandlers[n+"_action_"+c]||(e.one("body").delegate("click",M.editor_atto.buttonclicked_handler,".atto_"+n+"_action_"+c),M.editor_atto.buttonhandlers[n+"_action_"+c]=h.handler);M.editor_atto.buttonhandlers[n]||(e.one("body").delegate("click",M.editor_atto.showhide_menu_handler,".atto_"+n+"_button"),M.editor_atto.buttonhandlers[n]=!0);var p=new M.core.dialogue({bodyContent:l,visible:!1,width:"14em",zindex:100,lightbox:!1,closeButton:!1,centered:!1,align:{node:f,points:[e.WidgetPositionAlign.TL,e.WidgetPositionAlign.BL]}});M.editor_atto.menus[n+"_"+t]=p,p.render(),p.hide(),p.headerNode.hide()},add_toolbar_button:function(t,n,r,i,s){var o=e.one("#"+t+"_toolbar"),u=e.one("#"+t+"_toolbar .atto_group."+i+"_group"),a,f;u||(u=e.Node.create('<div class="atto_group '+i+'_group"></div>'),o.append(u)),a=e.Node.create('<button class="atto_'+n+'_button" '+'data-editor="'+e.Escape.html(t)+'" '+'data-plugin="'+e.Escape.html(n)+'" '+'tabindex="-1" '+'data-handler="'+e.Escape.html(n)+'">'+r+"</button>"),u.append(a),f=o.getAttribute("aria-activedescendant"),f||(a.setAttribute("tabindex","0"),o.setAttribute("aria-activedescendant",a.generateID())),M.editor_atto.buttonhandlers[n]||(e.one("body").delegate("click",M.editor_atto.buttonclicked_handler,".atto_"+n+"_button"),M.editor_atto.buttonhandlers[n]=s),M.editor_atto.widgets[n]=n},is_active:function(t){var n=M.editor_atto.get_selection();n.length&&(n=n.pop());var r=null;return n.parentElement?r=e.one(n.parentElement()):r=e.one(n.startContainer),r&&r.ancestor("#"+t+"editable")!==null},focus:function(t){e.one("#"+t+"editable").focus()},init:function(t){var n=e.one("#"+t.elementid),r=e.Node.create('<div class="'+CSS.WRAPPER+'" />'),i=e.Node.create('<div id="'+t.elementid+'editable" '+'contenteditable="true" '+'spellcheck="true" '+'class="'+CSS.CONTENT+'" />'),s="",o=e.Node.create('<div class="'+CSS.TOOLBAR+'" id="'+t.elementid+'_toolbar" role="toolbar"/>'),u=e.Node.create('<div class="'+CSS.CONTENTWRAPPER+'" />');u.appendChild(i),r.appendChild(o),r.appendChild(u);var a=e.io(t.content_css,{sync:!0}),f=a.responseText.indexOf("font:");f&&(s=a.responseText.substring(f+"font:".length,a.responseText.length-1),i.setStyle("font",s)),i.setStyle("minHeight",1.2*(n.getAttribute("rows")-1)+"em"),i.append(n.get("value")),n.get("parentNode").insert(r,n),i.setStyle("color",n.getStyle("color")),i.setStyle("lineHeight",n.getStyle("lineHeight")),i.setStyle("fontSize",n.getStyle("fontSize")),n.hide(),i.on("blur",function(){n.set("value",i.getHTML())}),e.one(e.config.doc.body).delegate("key",this.keyboard_navigation,"down:37,39","#"+t.elementid+"_toolbar",this,t.elementid),M.editor_atto.filepickeroptions[t.elementid]=t.filepickeroptions},keyboard_navigation:function(t,n){var r,i,s,o;t.preventDefault(),r=e.all("#"+n+"_toolbar button"),s=e.one("#"+n+"_toolbar").getAttribute("aria-activedescendant");if(!s)return;i=e.one("#"+s),i.setAttribute("tabindex","-1"),o=r.indexOf(i),t.keyCode===37?(o--,o<0&&(o=r.size()-1)):(o++,o>=r.size()&&(o=0)),i=r.item(o),i.setAttribute("tabindex","0"),i.focus(),e.one("#"+n+"_toolbar").setAttribute("aria-activedescendant",i.generateID())},show_filepicker:function(t,n,r){e.use("core_filepicker",function(e){var i=M.editor_atto.filepickeroptions[t][n];i.formcallback=r,i.editor_target=e.one(t),M.core_filepicker.show(e,i)})},get_selection_from_node:function(e){var t;return window.getSelection?(t=document.createRange(),t.setStartBefore(e.getDOMNode()),t.setEndAfter(e.getDOMNode()),[t]):document.selection?(t=document.body.createTextRange(),t.moveToElementText(e.getDOMNode()),t):!1},get_selection:function(){
+if(window.getSelection){var e=window.getSelection(),t=[],n=0;for(n=0;n<e.rangeCount;n++)t.push(e.getRangeAt(n));return t}return document.selection&&document.selection.createRange?document.selection.createRange():!1},get_selection_parent_node:function(){var e=M.editor_atto.get_selection();if(e.length>0)return e[0].commonAncestorContainer},get_selection_text:function(){var e=M.editor_atto.get_selection();if(e.length>0&&e[0].cloneContents)return e[0].cloneContents()},set_selection:function(e){var t,n;if(window.getSelection){t=window.getSelection(),t.removeAllRanges();for(n=0;n<e.length;n++)t.addRange(e[n])}else document.selection&&e.select&&e.select()}}},"@VERSION@",{requires:["node","io","overlay","escape","event-key","moodle-core-notification"]});
diff --git a/lib/editor/atto/yui/build/moodle-editor_atto-editor/moodle-editor_atto-editor.js b/lib/editor/atto/yui/build/moodle-editor_atto-editor/moodle-editor_atto-editor.js
index 96ccd495ef5..ccdc137dc2a 100644
--- a/lib/editor/atto/yui/build/moodle-editor_atto-editor/moodle-editor_atto-editor.js
+++ b/lib/editor/atto/yui/build/moodle-editor_atto-editor/moodle-editor_atto-editor.js
@@ -15,15 +15,34 @@ YUI.add('moodle-editor_atto-editor', function (Y, NAME) {
 // You should have received a copy of the GNU General Public License
 // along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
 
+/**
+ * Atto editor.
+ *
+ * @package    editor_atto
+ * @copyright  2013 Damyon Wiese  <damyon@moodle.com>
+ * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+
+/**
+ * Classes constants.
+ */
+CSS = {
+    CONTENT: 'editor_atto_content',
+    CONTENTWRAPPER: 'editor_atto_content_wrap',
+    TOOLBAR: 'editor_atto_toolbar',
+    WRAPPER: 'editor_atto'
+};
+
 /**
  * Atto editor main class.
  * Common functions required by editor plugins.
  *
- * @package    editor-atto
+ * @package    editor_atto
  * @copyright  2013 Damyon Wiese  <damyon@moodle.com>
  * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
  */
 M.editor_atto = M.editor_atto || {
+
     /**
      * List of attached button handlers to prevent duplicates.
      */
@@ -309,12 +328,22 @@ M.editor_atto = M.editor_atto || {
      */
     init : function(params) {
         var textarea = Y.one('#' +params.elementid);
+        var wrapper = Y.Node.create('<div class="' + CSS.WRAPPER + '" />');
         var atto = Y.Node.create('<div id="' + params.elementid + 'editable" ' +
                                             'contenteditable="true" ' +
                                             'spellcheck="true" ' +
-                                            'class="editor_atto"/>');
+                                            'class="' + CSS.CONTENT + '" />');
+
         var cssfont = '';
-        var toolbar = Y.Node.create('<div class="editor_atto_toolbar" id="' + params.elementid + '_toolbar" role="toolbar"/>');
+        var toolbar = Y.Node.create('<div class="' + CSS.TOOLBAR + '" id="' + params.elementid + '_toolbar" role="toolbar"/>');
+
+        // Editable content wrapper.
+        var content = Y.Node.create('<div class="' + CSS.CONTENTWRAPPER + '" />');
+        content.appendChild(atto);
+
+        // Add everything to the wrapper.
+        wrapper.appendChild(toolbar);
+        wrapper.appendChild(content);
 
         // Bleh - why are we sent a url and not the css to apply directly?
         var css = Y.io(params.content_css, { sync: true });
@@ -328,10 +357,8 @@ M.editor_atto = M.editor_atto || {
         // Copy text to editable div.
         atto.append(textarea.get('value'));
 
-        // Add the toolbar to the page.
-        textarea.get('parentNode').insert(toolbar, textarea);
-        // Add the editable div to the page.
-        textarea.get('parentNode').insert(atto, textarea);
+        // Add the toolbar and editable zone to the page.
+        textarea.get('parentNode').insert(wrapper, textarea);
         atto.setStyle('color', textarea.getStyle('color'));
         atto.setStyle('lineHeight', textarea.getStyle('lineHeight'));
         atto.setStyle('fontSize', textarea.getStyle('fontSize'));
diff --git a/lib/editor/atto/yui/src/editor/js/editor.js b/lib/editor/atto/yui/src/editor/js/editor.js
index 30e18927c95..be956f0040f 100644
--- a/lib/editor/atto/yui/src/editor/js/editor.js
+++ b/lib/editor/atto/yui/src/editor/js/editor.js
@@ -13,15 +13,34 @@
 // You should have received a copy of the GNU General Public License
 // along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
 
+/**
+ * Atto editor.
+ *
+ * @package    editor_atto
+ * @copyright  2013 Damyon Wiese  <damyon@moodle.com>
+ * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+
+/**
+ * Classes constants.
+ */
+CSS = {
+    CONTENT: 'editor_atto_content',
+    CONTENTWRAPPER: 'editor_atto_content_wrap',
+    TOOLBAR: 'editor_atto_toolbar',
+    WRAPPER: 'editor_atto'
+};
+
 /**
  * Atto editor main class.
  * Common functions required by editor plugins.
  *
- * @package    editor-atto
+ * @package    editor_atto
  * @copyright  2013 Damyon Wiese  <damyon@moodle.com>
  * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
  */
 M.editor_atto = M.editor_atto || {
+
     /**
      * List of attached button handlers to prevent duplicates.
      */
@@ -307,12 +326,22 @@ M.editor_atto = M.editor_atto || {
      */
     init : function(params) {
         var textarea = Y.one('#' +params.elementid);
+        var wrapper = Y.Node.create('<div class="' + CSS.WRAPPER + '" />');
         var atto = Y.Node.create('<div id="' + params.elementid + 'editable" ' +
                                             'contenteditable="true" ' +
                                             'spellcheck="true" ' +
-                                            'class="editor_atto"/>');
+                                            'class="' + CSS.CONTENT + '" />');
+
         var cssfont = '';
-        var toolbar = Y.Node.create('<div class="editor_atto_toolbar" id="' + params.elementid + '_toolbar" role="toolbar"/>');
+        var toolbar = Y.Node.create('<div class="' + CSS.TOOLBAR + '" id="' + params.elementid + '_toolbar" role="toolbar"/>');
+
+        // Editable content wrapper.
+        var content = Y.Node.create('<div class="' + CSS.CONTENTWRAPPER + '" />');
+        content.appendChild(atto);
+
+        // Add everything to the wrapper.
+        wrapper.appendChild(toolbar);
+        wrapper.appendChild(content);
 
         // Bleh - why are we sent a url and not the css to apply directly?
         var css = Y.io(params.content_css, { sync: true });
@@ -326,10 +355,8 @@ M.editor_atto = M.editor_atto || {
         // Copy text to editable div.
         atto.append(textarea.get('value'));
 
-        // Add the toolbar to the page.
-        textarea.get('parentNode').insert(toolbar, textarea);
-        // Add the editable div to the page.
-        textarea.get('parentNode').insert(atto, textarea);
+        // Add the toolbar and editable zone to the page.
+        textarea.get('parentNode').insert(wrapper, textarea);
         atto.setStyle('color', textarea.getStyle('color'));
         atto.setStyle('lineHeight', textarea.getStyle('lineHeight'));
         atto.setStyle('fontSize', textarea.getStyle('fontSize'));