diff --git a/src/bottomSheet/__tests__/__snapshots__/BottomSheet.js.snap b/src/bottomSheet/__tests__/__snapshots__/BottomSheet.js.snap
index 0c06fbf8e7..b1b4b0633d 100644
--- a/src/bottomSheet/__tests__/__snapshots__/BottomSheet.js.snap
+++ b/src/bottomSheet/__tests__/__snapshots__/BottomSheet.js.snap
@@ -15,7 +15,7 @@ exports[`BottomSheet Component onLayout should be called 1`] = `
         <View
           style={
             Object {
-              "alignSelf": "center",
+              "alignItems": "center",
               "backgroundColor": "white",
               "borderColor": "#bcbbc1",
               "flexDirection": "row",
@@ -98,7 +98,7 @@ exports[`BottomSheet Component onLayout should be called 1`] = `
         <View
           style={
             Object {
-              "alignSelf": "center",
+              "alignItems": "center",
               "backgroundColor": "white",
               "borderColor": "#bcbbc1",
               "flexDirection": "row",
@@ -272,7 +272,7 @@ Array [
                 <View
                   style={
                     Object {
-                      "alignSelf": "center",
+                      "alignItems": "center",
                       "backgroundColor": "white",
                       "borderColor": "#bcbbc1",
                       "flexDirection": "row",
@@ -355,7 +355,7 @@ Array [
                 <View
                   style={
                     Object {
-                      "alignSelf": "center",
+                      "alignItems": "center",
                       "backgroundColor": "white",
                       "borderColor": "#bcbbc1",
                       "flexDirection": "row",
diff --git a/src/list/ListItem.js b/src/list/ListItem.js
index e4e9b2a672..7ad01663b7 100644
--- a/src/list/ListItem.js
+++ b/src/list/ListItem.js
@@ -26,7 +26,6 @@ const chevronDefaultProps = {
   color: '#D1D1D6',
   name: Platform.OS === 'ios' ? 'ios-arrow-forward' : 'keyboard-arrow-right',
   size: 16,
-  containerStyle: { alignSelf: 'center' },
 };
 
 const checkmarkDefaultProps = (theme) => ({
@@ -230,7 +229,7 @@ const styles = {
       },
     }),
     flexDirection: 'row',
-    alignSelf: 'center',
+    alignItems: 'center',
     backgroundColor: 'white',
     borderColor: theme.colors.divider,
   }),
diff --git a/src/list/__tests__/__snapshots__/ListItem.js.snap b/src/list/__tests__/__snapshots__/ListItem.js.snap
index b182f6d4f6..69a267f1c5 100644
--- a/src/list/__tests__/__snapshots__/ListItem.js.snap
+++ b/src/list/__tests__/__snapshots__/ListItem.js.snap
@@ -8,7 +8,7 @@ exports[`ListItem component should apply values from theme 1`] = `
   <View
     style={
       Object {
-        "alignSelf": "center",
+        "alignItems": "center",
         "backgroundColor": "white",
         "borderColor": "#bcbbc1",
         "flexDirection": "row",
@@ -95,7 +95,7 @@ exports[`ListItem component should render with avatar 1`] = `
     pad={16}
     style={
       Object {
-        "alignSelf": "center",
+        "alignItems": "center",
         "backgroundColor": "peru",
         "borderColor": "#bcbbc1",
         "flexDirection": "row",
@@ -123,7 +123,7 @@ exports[`ListItem component should render with input 1`] = `
     pad={16}
     style={
       Object {
-        "alignSelf": "center",
+        "alignItems": "center",
         "backgroundColor": "white",
         "borderColor": "#bcbbc1",
         "flexDirection": "row",
@@ -177,7 +177,7 @@ exports[`ListItem component should render with left icon 1`] = `
     pad={16}
     style={
       Object {
-        "alignSelf": "center",
+        "alignItems": "center",
         "backgroundColor": "white",
         "borderColor": "#bcbbc1",
         "flexDirection": "row",
@@ -211,7 +211,7 @@ exports[`ListItem component should render with left icon component 1`] = `
     pad={16}
     style={
       Object {
-        "alignSelf": "center",
+        "alignItems": "center",
         "backgroundColor": "white",
         "borderColor": "#bcbbc1",
         "flexDirection": "row",
@@ -242,7 +242,7 @@ exports[`ListItem component should render with right icon component 1`] = `
     pad={16}
     style={
       Object {
-        "alignSelf": "center",
+        "alignItems": "center",
         "backgroundColor": "white",
         "borderColor": "#bcbbc1",
         "flexDirection": "row",
@@ -273,7 +273,7 @@ exports[`ListItem component should render with switch 1`] = `
     pad={16}
     style={
       Object {
-        "alignSelf": "center",
+        "alignItems": "center",
         "backgroundColor": "white",
         "borderBottomWidth": 0.5,
         "borderColor": "#bcbbc1",
@@ -297,11 +297,6 @@ exports[`ListItem component should render with switch 1`] = `
     />
     <Themed.Icon
       color="#D1D1D6"
-      containerStyle={
-        Object {
-          "alignSelf": "center",
-        }
-      }
       name="ios-arrow-forward"
       size={16}
       type="ionicon"
@@ -317,7 +312,7 @@ exports[`ListItem component should render with title and subtitle 1`] = `
     pad={16}
     style={
       Object {
-        "alignSelf": "center",
+        "alignItems": "center",
         "backgroundColor": "white",
         "borderColor": "#bcbbc1",
         "flexDirection": "row",
@@ -389,7 +384,7 @@ exports[`ListItem component should render without issues 1`] = `
     pad={16}
     style={
       Object {
-        "alignSelf": "center",
+        "alignItems": "center",
         "backgroundColor": "white",
         "borderColor": "#bcbbc1",
         "flexDirection": "row",