diff --git a/app/components/markdown/markdown_list.js b/app/components/markdown/markdown_list.js
index 70b9a6e58..05e654fac 100644
--- a/app/components/markdown/markdown_list.js
+++ b/app/components/markdown/markdown_list.js
@@ -1,9 +1,8 @@
 // Copyright (c) 2017-present Mattermost, Inc. All Rights Reserved.
 // See License.txt for license information.
 
-import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
-import {StyleSheet, View} from 'react-native';
+import React, {PureComponent} from 'react';
 
 export default class MarkdownList extends PureComponent {
     static propTypes = {
@@ -33,15 +32,9 @@ export default class MarkdownList extends PureComponent {
         });
 
         return (
-            <View style={style.indent}>
+            <React.Fragment>
                 {children}
-            </View>
+            </React.Fragment>
         );
     }
 }
-
-const style = StyleSheet.create({
-    indent: {
-        marginRight: 20,
-    },
-});
diff --git a/app/components/markdown/markdown_list_item.js b/app/components/markdown/markdown_list_item.js
index e19b6d7b6..3a2bc5a30 100644
--- a/app/components/markdown/markdown_list_item.js
+++ b/app/components/markdown/markdown_list_item.js
@@ -41,7 +41,7 @@ export default class MarkdownListItem extends PureComponent {
                         {bullet}
                     </Text>
                 </View>
-                <View>
+                <View style={style.contents}>
                     {this.props.children}
                 </View>
             </View>
@@ -50,12 +50,15 @@ export default class MarkdownListItem extends PureComponent {
 }
 
 const style = StyleSheet.create({
-    bullet: {
-        alignItems: 'flex-end',
-        marginRight: 5,
-    },
     container: {
         flexDirection: 'row',
         alignItems: 'flex-start',
     },
+    bullet: {
+        alignItems: 'flex-end',
+        marginRight: 5,
+    },
+    contents: {
+        flex: 1,
+    },
 });