diff --git a/cms/static/js/views/modals/edit_xblock.js b/cms/static/js/views/modals/edit_xblock.js
index 53fed55ba2..294770d4ad 100644
--- a/cms/static/js/views/modals/edit_xblock.js
+++ b/cms/static/js/views/modals/edit_xblock.js
@@ -132,17 +132,11 @@ define(["jquery", "underscore", "gettext", "js/views/modals/base_modal",
             },
 
             changeMode: function(event) {
+                this.removeCheatsheetVisibility();
                 var parent = $(event.target.parentElement),
                     mode = parent.data('mode');
                 event.preventDefault();
                 this.selectMode(mode);
-                var $cheatsheet = $('.simple-editor-cheatsheet');
-                if ($cheatsheet.length == 0){
-                    $cheatsheet = $('.simple-editor-open-ended-cheatsheet');
-                }
-                $(".CodeMirror").css({"overflow": "none"});
-                $(".modal-content").removeAttr("style");
-                $cheatsheet.removeClass('shown');
             },
 
             selectMode: function(mode) {
@@ -204,6 +198,17 @@ define(["jquery", "underscore", "gettext", "js/views/modals/base_modal",
                     mode: mode,
                     displayName: displayName
                 }));
+            },
+
+            removeCheatsheetVisibility: function() {
+                var cheatsheet = $('article.simple-editor-open-ended-cheatsheet');
+                if (cheatsheet.length === 0) {
+                    cheatsheet = $('article.simple-editor-cheatsheet');
+                }
+                if (cheatsheet.hasClass('shown')) {
+                    cheatsheet.removeClass('shown');
+                    $('.modal-content').removeClass('cheatsheet-is-shown');
+                }
             }
         });
 
diff --git a/cms/static/sass/_shame.scss b/cms/static/sass/_shame.scss
index b03976331a..8085c8b95b 100644
--- a/cms/static/sass/_shame.scss
+++ b/cms/static/sass/_shame.scss
@@ -74,3 +74,11 @@ body b {
 * use the @include placeholder Bourbon mixin (http://bourbon.io/docs/#placeholder) for any placeholder styling
 
 */
+
+.modal-content.cheatsheet-is-shown {
+  overflow: visible !important;
+
+  .CodeMirror {
+    overflow: visible !important;
+  }
+}
\ No newline at end of file
diff --git a/common/lib/xmodule/xmodule/js/src/combinedopenended/edit.coffee b/common/lib/xmodule/xmodule/js/src/combinedopenended/edit.coffee
index 9434fa7e02..9fa40cb999 100644
--- a/common/lib/xmodule/xmodule/js/src/combinedopenended/edit.coffee
+++ b/common/lib/xmodule/xmodule/js/src/combinedopenended/edit.coffee
@@ -87,8 +87,9 @@ Write a persuasive essay to a newspaper reflecting your views on censorship in l
   ###
   onShowXMLButton: (e) =>
     e.preventDefault();
-    if @cheatsheet != undefined
-      @addRemoveCheatsheetCSS()
+    if @cheatsheet && @cheatsheet.hasClass('shown')
+      @cheatsheet.toggleClass('shown')
+      @toggleCheatsheetVisibility()
     if @confirmConversionToXml()
       @createXMLEditor(OpenEndedMarkdownEditingDescriptor.markdownToXml(@markdown_editor.getValue()))
       # Need to refresh to get line numbers to display properly (and put cursor position to 0)
@@ -133,21 +134,16 @@ Write a persuasive essay to a newspaper reflecting your views on censorship in l
       @cheatsheet = $($('#simple-editor-open-ended-cheatsheet').html())
       $(@markdown_editor.getWrapperElement()).append(@cheatsheet)
 
-    @addRemoveCheatsheetCSS()
+    @toggleCheatsheetVisibility()
 
     setTimeout (=> @cheatsheet.toggleClass('shown')), 10
 
 
   ###
-  Function to add/remove CSS for cheatsheet.
+  Function to toggle cheatsheet visibility.
   ###
-  addRemoveCheatsheetCSS: () =>
-    if !@cheatsheet.hasClass("shown")
-      $(".CodeMirror").css({"overflow": "visible"})
-      $(".modal-content").css({"overflow-y": "visible", "overflow-x": "visible"})
-    else
-      $(".CodeMirror").css({"overflow": ""})
-      $(".modal-content").removeAttr("style")
+  toggleCheatsheetVisibility: () =>
+    $('.modal-content').toggleClass('cheatsheet-is-shown')
 
 
   ###
diff --git a/common/lib/xmodule/xmodule/js/src/problem/edit.coffee b/common/lib/xmodule/xmodule/js/src/problem/edit.coffee
index 30d448dd65..1885e7515a 100644
--- a/common/lib/xmodule/xmodule/js/src/problem/edit.coffee
+++ b/common/lib/xmodule/xmodule/js/src/problem/edit.coffee
@@ -48,8 +48,9 @@ class @MarkdownEditingDescriptor extends XModule.Descriptor
   ###
   onShowXMLButton: (e) =>
     e.preventDefault();
-    if @cheatsheet != undefined
-      @addRemoveCheatsheetCSS()
+    if @cheatsheet && @cheatsheet.hasClass('shown')
+      @cheatsheet.toggleClass('shown')
+      @toggleCheatsheetVisibility()
     if @confirmConversionToXml()
       @createXMLEditor(MarkdownEditingDescriptor.markdownToXml(@markdown_editor.getValue()))
       # Need to refresh to get line numbers to display properly (and put cursor position to 0)
@@ -96,21 +97,16 @@ class @MarkdownEditingDescriptor extends XModule.Descriptor
       @cheatsheet = $($('#simple-editor-cheatsheet').html())
       $(@markdown_editor.getWrapperElement()).append(@cheatsheet)
 
-    @addRemoveCheatsheetCSS()
+    @toggleCheatsheetVisibility()
 
     setTimeout (=> @cheatsheet.toggleClass('shown')), 10
 
 
   ###
-  Function to add/remove CSS for cheatsheet.
+  Function to toggle cheatsheet visibility.
   ###
-  addRemoveCheatsheetCSS: () =>
-    if !@cheatsheet.hasClass("shown")
-      $(".CodeMirror").css({"overflow": "visible"})
-      $(".modal-content").css({"overflow-y": "visible", "overflow-x": "visible"})
-    else
-      $(".CodeMirror").css({"overflow": "none"})
-      $(".modal-content").removeAttr("style")
+  toggleCheatsheetVisibility: () =>
+    $('.modal-content').toggleClass('cheatsheet-is-shown')
 
   ###
   Stores the current editor and hides the one that is not displayed.