[Text] Text doesn't wrap

http://puu.sh/i407j/805ec722a0.png Text doesn’t wrap when it’s wrapped inside :

msgReceivedAlignContainer: {
    flex: 1,
    flexDirection: 'column',
    alignItems: 'flex-w',
  },

[a11y1337]

Hey there @mvnnn, I was able to get this to work by adding a ‘flex: 1’ property to the text element. Hopefully it works in your situation, as well.

<View style={{flexDirection:'row'}}> <Text style={{flex: 1, flexWrap: 'wrap'}}> You miss fdddddd dddddddd You miss fdddddd dddddddd</Text> </View>

[dwilt]

I tried @a11y1337 's method and it didn’t work for me. I have a situation where I have text sitting in a View along side of another View and the text is running through the parent’s padding and out of the parent’s container:

Markup:

<View style={styles.container}>
    <AlbumCover
        image={album_cover}
        width={smallAlbumCover}
        height={smallAlbumCover}
        borderRadius={6}
    />
    <View style={styles.info}>
        <Text style={styles.title} allowFontScaling={false}>{title}</Text>
        <Text style={styles.author} allowFontScaling={false}>{author}</Text>
    </View>
</View>

Styles:

export default StyleSheet.create({
    container: {
        flexDirection: 'row',
        alignItems: 'center',
    },
    info: {
        flexGrow: 1,
        marginLeft: gutter,
    },
    title: {
        fontSize: 16,
        fontFamily: sansSerifLight,
        color: nearlyBlack,
    },
    author: {
        fontSize: 12,
        fontFamily: sansSerif,
        color: greyishBrown,
    }
});

As I said, I tried all of the the suggestions here and nothing seemed to work. WHAT DID WORK was adding a width: 0 to the info style:

info: {
    width: 0,
    flexGrow: 1,
    marginLeft: gutter,
},

and voilà: