diff --git a/native/chat/composed-message.react.js b/native/chat/composed-message.react.js
--- a/native/chat/composed-message.react.js
+++ b/native/chat/composed-message.react.js
@@ -99,11 +99,11 @@
       { maxWidth: composedMessageMaxWidth },
     ];
 
-    const messageBoxStyleContainerStyle = [styles.messageBoxContainer];
+    const messageBoxContainerStyle = [styles.messageBoxContainer];
     const positioningStyle = isViewer
-      ? { alignItems: 'flex-end' }
-      : { alignItems: 'flex-start' };
-    messageBoxStyleContainerStyle.push(positioningStyle);
+      ? styles.rightChatContainer
+      : styles.leftChatContainer;
+    messageBoxContainerStyle.push(positioningStyle);
 
     let deliveryIcon = null;
     let failedSendInfo = null;
@@ -152,7 +152,7 @@
     }
 
     const messageBox = (
-      <View style={messageBoxStyleContainerStyle}>
+      <View style={messageBoxContainerStyle}>
         <SwipeableMessage
           triggerReply={triggerReply}
           triggerSidebar={triggerSidebar}
@@ -243,6 +243,9 @@
   leftChatBubble: {
     justifyContent: 'flex-end',
   },
+  leftChatContainer: {
+    alignItems: 'flex-start',
+  },
   messageBoxContainer: {
     flex: 1,
     marginRight: 5,
@@ -250,6 +253,9 @@
   rightChatBubble: {
     justifyContent: 'flex-start',
   },
+  rightChatContainer: {
+    alignItems: 'flex-end',
+  },
   swipeableContainer: {
     alignItems: 'flex-end',
     flexDirection: 'row',