react-native: Some Style Props for nested Text component is not working

Environment

Environment:
  OS: Windows 8.1
  Node: 8.11.2
  Yarn: 1.7.0
  npm: 6.1.0
  Watchman: Not Found
  Xcode: N/A
  Android Studio: Version  2.3.0.0 AI-162.3871768

Packages: (wanted => installed)
  react: 16.3.1 => 16.3.1
  react-native: 0.55.4 => 0.55.4

Description

Some style props such as borderBottomWidth - marginVertical - width is NOT working for the nested Text components!

Reproducible Demo

import React, { Component } from "react";
import { Text, View, StyleSheet } from "react-native";

export default class App extends Component {
  render() {
    return (
      <View style={styles.container}>
        <Text>
          <Text>First</Text>
          <Text style={{ borderBottomWidth: 1 }}>Second</Text>
          <Text>Third</Text>
        </Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: "center",
    justifyContent: "center",
    backgroundColor: "#ECF0F1"
  }
});

About this issue

  • Original URL
  • State: closed
  • Created 6 years ago
  • Reactions: 2
  • Comments: 15 (6 by maintainers)

Most upvoted comments

@hramos i guess it’s somehow related to this issue! Some props of Nested <Text> component have no effect!