title: React Native: Flex: 1 does not fill width of parent
body: <p>I'm using ListItem imported from native-base. ListItem is red and it's child View is yellow. As you can see from the screenshot, View style does not take entire width of ListItem, despite having a flex: 1. How can I make it so that View take entire width of ListItem?</p>
  
  <p><a href="https://i.stack.imgur.com/FjPm1.png" rel="nofollow noreferrer">See image here</a></p>
  
  <pre><code> &lt;List&gt;
  &lt;ListItem style={[styles.listitem, { backgroundColor: "red" }]}&gt;
      &lt;View
          style={{
              flex: 1,
              flexDirection: "column",
              backgroundColor: "yellow"
          }}
      &gt;
          &lt;Text style={styles.timeInfoHeader}&gt;{this.props.totalUsage}&lt;/Text&gt;
          &lt;Text style={styles.timeInfoSubHeader}&gt;Total (hrs)&lt;/Text&gt;
      &lt;/View&gt;
  &lt;/ListItem&gt;
  &lt;/List&gt;;
  </code></pre>
  
  <p>Stylesheet: </p>
  
  <pre><code>  timeInfoHeader: {
      fontSize: 40,
      color: 'rgba(45, 145, 176, 100)',
      textAlign: 'center'
    },
  
    timeInfoSubHeader: {
      fontSize: 12,
      color: 'rgba(209, 209, 209, 100)',
      paddingBottom: 4,
      marginBottom: 4,
      textAlign: 'center'
    },
  
    listitem: {
      width: '100%',
      marginLeft: 0
    },  
  </code></pre>