diff --git a/src/components/rich-text-editor/core-rich-text-editor.html b/src/components/rich-text-editor/core-rich-text-editor.html
index 7874c0162..c4b96e0fe 100644
--- a/src/components/rich-text-editor/core-rich-text-editor.html
+++ b/src/components/rich-text-editor/core-rich-text-editor.html
@@ -4,78 +4,78 @@
 <ion-textarea [hidden]="rteEnabled" #textarea class="core-textarea" [placeholder]="placeholder" [attr.name]="name" ngControl="control" (ionChange)="onChange($event)" (focus)="showToolbar()" (longPress)="showToolbar()" (longPress)="showToolbar()" role="textbox"></ion-textarea>
 
 <div #toolbar class="core-rte-toolbar" [class.toolbar-hidden]="toolbarHidden">
-    <button *ngIf="toolbarArrows" class="toolbar-arrow" [class.toolbar-arrow-hidden]="toolbarPrevHidden" (click)="toolbarPrev()">
+    <button *ngIf="toolbarArrows" class="toolbar-arrow" [class.toolbar-arrow-hidden]="toolbarPrevHidden" (click)="toolbarPrev($event)" (mousedown)="stopBubble($event)">
         <ion-icon name="arrow-back" md="ios-arrow-back"></ion-icon>
     </button>
     <ion-slides [slidesPerView]="numToolbarButtons" (ionSlideDidChange)="updateToolbarArrows()">
         <!-- https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand -->
         <ion-slide>
-            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.b" (click)="buttonAction($event, 'bold')">
+            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.b" (click)="buttonAction($event, 'bold')" (mousedown)="stopBubble($event)">
                 <core-icon name="fa-bold"></core-icon>
             </button>
         </ion-slide>
         <ion-slide>
-            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.i" (click)="buttonAction($event, 'italic')">
+            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.i" (click)="buttonAction($event, 'italic')" (mousedown)="stopBubble($event)">
                 <core-icon name="fa-italic"></core-icon>
             </button>
         </ion-slide>
         <ion-slide>
-            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.u" (click)="buttonAction($event, 'underline')">
+            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.u" (click)="buttonAction($event, 'underline')" (mousedown)="stopBubble($event)">
                 <core-icon name="fa-underline"></core-icon>
             </button>
         </ion-slide>
         <ion-slide>
-            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.strike" (click)="buttonAction($event, 'strikeThrough')">
+            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.strike" (click)="buttonAction($event, 'strikeThrough')" (mousedown)="stopBubble($event)">
                 <core-icon name="fa-strikethrough"></core-icon>
             </button>
         </ion-slide>
         <ion-slide>
-            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.p" (click)="buttonAction($event, 'formatBlock|<p>')">
+            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.p" (click)="buttonAction($event, 'formatBlock|<p>')" (mousedown)="stopBubble($event)">
                 <core-icon name="fa-paragraph"></core-icon>
             </button>
         </ion-slide>
         <ion-slide>
-            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.h1" (click)="buttonAction($event, 'formatBlock|<h1>')">
+            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.h1" (click)="buttonAction($event, 'formatBlock|<h1>')" (mousedown)="stopBubble($event)">
                 <core-icon name="fa-header"></core-icon>1
             </button>
         </ion-slide>
         <ion-slide>
-            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.h2" (click)="buttonAction($event, 'formatBlock|<h2>')">
+            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.h2" (click)="buttonAction($event, 'formatBlock|<h2>')" (mousedown)="stopBubble($event)">
                 <core-icon name="fa-header"></core-icon>2
             </button>
         </ion-slide>
         <ion-slide>
-            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.h3" (click)="buttonAction($event, 'formatBlock|<h3>')">
+            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.h3" (click)="buttonAction($event, 'formatBlock|<h3>')" (mousedown)="stopBubble($event)">
                 <core-icon name="fa-header"></core-icon>3
             </button>
         </ion-slide>
         <ion-slide>
-            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.ul" (click)="buttonAction($event, 'insertUnorderedList')">
+            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.ul" (click)="buttonAction($event, 'insertUnorderedList')" (mousedown)="stopBubble($event)">
                 <core-icon name="fa-list-ul"></core-icon>
             </button>
         </ion-slide>
         <ion-slide>
-            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.ol" (click)="buttonAction($event, 'insertOrderedList')">
+            <button [disabled]="!rteEnabled" [attr.aria-pressed]="toolbarStyles.ol" (click)="buttonAction($event, 'insertOrderedList')" (mousedown)="stopBubble($event)">
                 <core-icon name="fa-list-ol"></core-icon>
             </button>
         </ion-slide>
         <ion-slide>
-            <button [disabled]="!rteEnabled" (click)="buttonAction($event, 'removeFormat')">
+            <button [disabled]="!rteEnabled" (click)="buttonAction($event, 'removeFormat')" (mousedown)="stopBubble($event)">
                 <core-icon name="fa-eraser"></core-icon>
             </button>
         </ion-slide>
         <ion-slide>
-            <button [attr.aria-pressed]="rteEnabled ? 'false' : 'true'" (click)="toggleEditor($event)">
+            <button [attr.aria-pressed]="rteEnabled ? 'false' : 'true'" (click)="toggleEditor($event)" (mousedown)="stopBubble($event)">
                 <core-icon name="fa-code"></core-icon>
             </button>
         </ion-slide>
         <ion-slide *ngIf="isPhone">
-            <button (click)="hideToolbar()">
+            <button (click)="hideToolbar($event)" (mousedown)="stopBubble($event)">
                 <core-icon name="fa-close"></core-icon>
             </button>
         </ion-slide>
     </ion-slides>
-    <button *ngIf="toolbarArrows" class="toolbar-arrow" [class.toolbar-arrow-hidden]="toolbarNextHidden" (click)="toolbarNext()">
+    <button *ngIf="toolbarArrows" class="toolbar-arrow" [class.toolbar-arrow-hidden]="toolbarNextHidden" (click)="toolbarNext($event)" (mousedown)="stopBubble($event)">
         <ion-icon name="arrow-forward" md="ios-arrow-forward"></ion-icon>
     </button>
 </div>
diff --git a/src/components/rich-text-editor/rich-text-editor.ts b/src/components/rich-text-editor/rich-text-editor.ts
index 45e572d37..44be93408 100644
--- a/src/components/rich-text-editor/rich-text-editor.ts
+++ b/src/components/rich-text-editor/rich-text-editor.ts
@@ -533,10 +533,8 @@ export class CoreRichTextEditorComponent implements AfterContentInit, OnDestroy
      * @param {any} $event Event data
      * @param {string} command Command to execute.
      */
-    protected buttonAction($event: any, command: string): void {
-        $event.preventDefault();
-        $event.stopPropagation();
-        this.editorElement.focus();
+    buttonAction($event: any, command: string): void {
+        this.stopBubble($event);
 
         if (command) {
             if (command.includes('|')) {
@@ -553,8 +551,9 @@ export class CoreRichTextEditorComponent implements AfterContentInit, OnDestroy
     /**
      * Hide the toolbar.
      */
-    hideToolbar(): void {
-        this.editorElement.focus();
+    hideToolbar($event: any): void {
+        this.stopBubble($event);
+
         this.toolbarHidden = true;
     }
 
@@ -566,26 +565,38 @@ export class CoreRichTextEditorComponent implements AfterContentInit, OnDestroy
         this.toolbarHidden = false;
     }
 
+    /**
+     * Stop event default and propagation.
+     *
+     * @param {Event} event Event.
+     */
+    stopBubble(event: Event): void {
+        event.preventDefault();
+        event.stopPropagation();
+    }
+
     /**
      * Method that shows the next toolbar buttons.
      */
-    toolbarNext(): void {
+    toolbarNext($event: any): void {
+        this.stopBubble($event);
+
         if (!this.toolbarNextHidden) {
             const currentIndex = this.toolbarSlides.getActiveIndex() || 0;
             this.toolbarSlides.slideTo(currentIndex + this.numToolbarButtons);
         }
-        this.editorElement.focus();
     }
 
     /**
      * Method that shows the previous toolbar buttons.
      */
-    toolbarPrev(): void {
+    toolbarPrev($event: any): void {
+        this.stopBubble($event);
+
         if (!this.toolbarPrevHidden) {
             const currentIndex = this.toolbarSlides.getActiveIndex() || 0;
             this.toolbarSlides.slideTo(currentIndex - this.numToolbarButtons);
         }
-        this.editorElement.focus();
     }
 
     /**