title: Why does adding a parent View Tag in React Native change the style?
body: <p>Adding a <code>View</code> parent breaks my styles, why is this happening? Does React Native's <code>View</code> tag have some default styles that I'm unaware of?</p>
  
  <p>Below is the Button component as well as a screenshot with and without the View Tag.</p>
  
  <pre><code>class Button extends Component {
    render() {
      return (
        &lt;View&gt;
          &lt;TouchableOpacity style={styles.buttonStyle}&gt;
            &lt;Text style={styles.textStyle}&gt;Hello&lt;/Text&gt;
          &lt;/TouchableOpacity&gt;
        &lt;/View&gt;
      );
    }
  }
  
  const styles = StyleSheet.create({
    textStyle: {
      alignSelf: "center",
      color: "#007aff",
      fontSize: 16,
      fontWeight: "600",
      paddingTop: 10,
      paddingBottom: 10
    },
    buttonStyle: {
      flex: 1,
      alignSelf: "stretch",
      backgroundColor: "#fff",
      borderRadius: 5,
      borderWidth: 1,
      borderColor: "#007aff",
      marginLeft: 5,
      marginRight: 5
    }
  });
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/uXXDz.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/uXXDz.png" alt="With View Tag"></a></p>
  
  <p><a href="https://i.stack.imgur.com/QK9FH.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/QK9FH.png" alt="Without View Tag"></a></p>
  
  <p>The button is being rendered inside another component(A typical card component), if need I can provide that code as well. </p>