Quantcast
Channel: Active questions tagged flexbox - Stack Overflow
Viewing all articles
Browse latest Browse all 1675

position absolute top:0, bottom: 0, right:0, left:0 and parent paddings

$
0
0

position absolute with all its properties in 0 makes the child element expand in the parent element, and if I put a padding in the parent element without a height the child with the position absolute cover until the of the parent padding, my theory is right or I am forgotting something here?there could be another different case?

import React from 'react';import {View, StyleSheet} from 'react-native';import Video from 'react-native-video';export default function Reproductor(props) {  return (<View style={styles.container}><View style={styles.videoContainer}><Video          source={{            uri:'http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4',          }}          resizeMode="cover"          style={styles.video}        /></View></View>  );}const styles = StyleSheet.create({  container: {    height: 250,    justifyContent: 'center',    alignItems: 'center',  },  videoContainer: {    width: '90%',    paddingTop: '56.25%',    borderRadius: 20,    overflow: 'hidden',    borderWidth: 3,    backgroundColor: 'black',  },  video: {    position: 'absolute',    top: 0,    left: 0,    bottom: 0,    right: 0,  },});

the child (video) covers the padding


Viewing all articles
Browse latest Browse all 1675

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>