diff --git a/src/AnnotationCreation.js b/src/AnnotationCreation.js
index 49029d34e43646aa4679dff80e811b135639a0a6..16a4b4aa5f32b3a739703e32466808e293d03a01 100644
--- a/src/AnnotationCreation.js
+++ b/src/AnnotationCreation.js
@@ -389,6 +389,18 @@ class AnnotationCreation extends Component {
           player={mediaIsVideo ? VideosReferences.get(windowId) : OSDReferences.get(windowId)}
         />
         <form onSubmit={this.submitForm} className={classes.section}>
+          <Grid item xs={12}>
+            <Typography variant="overline">
+              Text Content
+            </Typography>
+          </Grid>
+          <Grid item xs={12}>
+            <TextEditor
+                key={textEditorStateBustingKey}
+                annoHtml={textBody}
+                updateAnnotationBody={this.updateTextBody}
+            />
+          </Grid>
           <Grid container>
             { mediaIsVideo && (
             <>
@@ -450,18 +462,6 @@ class AnnotationCreation extends Component {
             <Grid item xs={12} style={{ marginBottom: 10 }}>
               <ImageFormField value={image} onChange={this.handleImgChange} />
             </Grid>
-            <Grid item xs={12}>
-              <Typography variant="overline">
-                Text Content
-              </Typography>
-            </Grid>
-            <Grid item xs={12}>
-              <TextEditor
-                key={textEditorStateBustingKey}
-                annoHtml={textBody}
-                updateAnnotationBody={this.updateTextBody}
-              />
-            </Grid>
           </Grid>
           <Grid container>
             <Grid item xs={12}>
diff --git a/src/TextEditor.js b/src/TextEditor.js
index 3dcaee93331711730837351c78e6bc8794bd7f62..5f24d6dfa65f95c0285041742b8aba3fa7ed6010 100644
--- a/src/TextEditor.js
+++ b/src/TextEditor.js
@@ -70,34 +70,33 @@ class TextEditor extends Component {
     const currentStyle = editorState.getCurrentInlineStyle();
 
     return (
-      <div>
-        <ToggleButtonGroup
-          size="small"
-          value={currentStyle.toArray()}
-        >
-          <ToggleButton
-            onClick={this.handleFormating}
-            value="BOLD"
+        <div>
+          <div className={classes.editorRoot} onClick={this.handleFocus}>
+            <Editor
+                editorState={editorState}
+                handleKeyCommand={this.handleKeyCommand}
+                onChange={this.onChange}
+                ref={this.editorRef}
+            />
+          </div>
+          <ToggleButtonGroup
+              size="small"
+              value={currentStyle.toArray()}
           >
-            <BoldIcon />
-          </ToggleButton>
-          <ToggleButton
-            onClick={this.handleFormating}
-            value="ITALIC"
-          >
-            <ItalicIcon />
-          </ToggleButton>
-        </ToggleButtonGroup>
-
-        <div className={classes.editorRoot} onClick={this.handleFocus}>
-          <Editor
-            editorState={editorState}
-            handleKeyCommand={this.handleKeyCommand}
-            onChange={this.onChange}
-            ref={this.editorRef}
-          />
+            <ToggleButton
+                onClick={this.handleFormating}
+                value="BOLD"
+            >
+              <BoldIcon/>
+            </ToggleButton>
+            <ToggleButton
+                onClick={this.handleFormating}
+                value="ITALIC"
+            >
+              <ItalicIcon/>
+            </ToggleButton>
+          </ToggleButtonGroup>
         </div>
-      </div>
     );
   }
 }