diff --git a/core/src/components/menu/menu.tsx b/core/src/components/menu/menu.tsx
index b4c943ffe9..230580f43a 100644
--- a/core/src/components/menu/menu.tsx
+++ b/core/src/components/menu/menu.tsx
@@ -90,7 +90,7 @@ export class Menu {
   /**
    * Which side of the view the menu should be placed. Default `"start"`.
    */
-  @Prop() side: Side = 'start';
+  @Prop({ reflectToAttr: true }) side: Side = 'start';
 
   @Watch('side')
   protected sideChanged() {
diff --git a/core/src/components/split-pane/split-pane.ios.scss b/core/src/components/split-pane/split-pane.ios.scss
index c27d6acd55..d338fcdbee 100644
--- a/core/src/components/split-pane/split-pane.ios.scss
+++ b/core/src/components/split-pane/split-pane.ios.scss
@@ -1,12 +1,11 @@
 
-@import "../../themes/ionic.globals.ios";
 @import "./split-pane";
 @import "./split-pane.ios.vars";
 
 // Split Pane
 // --------------------------------------------------
 
-.split-pane-ios.split-pane-visible > .split-pane-side {
+.split-pane-ios.split-pane-visible > .split-pane-side[side=start] {
   min-width: $split-pane-ios-side-min-width;
   max-width: $split-pane-ios-side-max-width;
 
@@ -14,7 +13,10 @@
   border-left: 0;
 }
 
-.split-pane-ios.split-pane-visible > .split-pane-side[side=right] {
+.split-pane-ios.split-pane-visible > .split-pane-side[side=end] {
+  min-width: $split-pane-ios-side-min-width;
+  max-width: $split-pane-ios-side-max-width;
+
   border-right: 0;
   border-left: $split-pane-ios-border;
 }
diff --git a/core/src/components/split-pane/split-pane.md.scss b/core/src/components/split-pane/split-pane.md.scss
index a3588762eb..fed364db08 100644
--- a/core/src/components/split-pane/split-pane.md.scss
+++ b/core/src/components/split-pane/split-pane.md.scss
@@ -4,7 +4,7 @@
 // Split Pane
 // --------------------------------------------------
 
-.split-pane-md.split-pane-visible > .split-pane-side {
+.split-pane-md.split-pane-visible > .split-pane-side[side=start] {
   min-width: $split-pane-md-side-min-width;
   max-width: $split-pane-md-side-max-width;
 
@@ -12,7 +12,10 @@
   border-left: 0;
 }
 
-.split-pane-md.split-pane-visible > .split-pane-side[side=right] {
+.split-pane-md.split-pane-visible > .split-pane-side[side=end] {
+  min-width: $split-pane-md-side-min-width;
+  max-width: $split-pane-md-side-max-width;
+
   border-right: 0;
   border-left: $split-pane-md-border;
 }
diff --git a/core/src/components/split-pane/split-pane.scss b/core/src/components/split-pane/split-pane.scss
index 4e33dca09d..c639a7a510 100644
--- a/core/src/components/split-pane/split-pane.scss
+++ b/core/src/components/split-pane/split-pane.scss
@@ -33,7 +33,6 @@
   display: flex;
 
   flex-shrink: 0;
-  order: -1;
 }
 
 .split-pane-side:not(ion-menu) {
@@ -41,33 +40,9 @@
 }
 
 .split-pane-visible > .split-pane-side[side=start] {
-  @include multi-dir() {
-    order: -1;
-  }
+  order: -1;
 }
 
 .split-pane-visible > .split-pane-side[side=end] {
-  @include multi-dir() {
-    order: 1;
-  }
-}
-
-.split-pane-visible > .split-pane-side[side=left] {
-  @include ltr() {
-    order: -1;
-  }
-
-  @include rtl() {
-    order: 1;
-  }
-}
-
-.split-pane-visible > .split-pane-side[side=right] {
-  @include ltr() {
-    order: 1;
-  }
-
-  @include rtl() {
-    order: -1;
-  }
+  order: 1;
 }
diff --git a/core/src/components/split-pane/test/basic/index.html b/core/src/components/split-pane/test/basic/index.html
index 449262ed95..8e6f2b173d 100644
--- a/core/src/components/split-pane/test/basic/index.html
+++ b/core/src/components/split-pane/test/basic/index.html
@@ -13,7 +13,7 @@
   <ion-app>
     <ion-split-pane id="splitPane">
 
-      <ion-menu side="start">
+      <ion-menu side="end">
 
         <ion-header>
           <ion-toolbar color="secondary">