how to make react native web full height?

Adding this style on container of my App file works for me Acctully:

const styles = StyleSheet.create({
  root: {
    flex:1,
    ...Platform.select({web: {height: '100vh'}}),
  },
});

App.js look like this:

...
return(<View style={styles.root}>
...

React native does not understand viewport units. We can use Platform API provided by react-native.

If you want full height for mobile as well as a web while using react-native-web try this method.

<View style={styles.fullHeight}>
  <Text>Hey there</Text>
</View>

CSS code

const styles = StyleSheet.create({
  fullHeight: {
    height: Platform.OS === 'web' ? '100vh' : '100%'
  }
})

or

const styles = StyleSheet.create({
   fullHeight: {
     ...Platform.select({web: {height: '100vh'}, default: {height: '100%'}})
   }
})

flex: 1 and height: "100%" work fine for mobile version of react-native-web but not for web. Dimensions.get("window").height - work good for both versions.

what fix my problem is the position property

position:'absolute' or position:'fixed'

relative not working position:'relative'