I'm having an issue with my NavDiv styled component not taking up the full height of my Wrapper styled component. I've tried setting the height using different units like percentage, em, rem, but it doesn't seem to work. It only works when using the px unit.
const Wrapper = styled.div`
min-width: 100vw;
min-height: 100vh;
`
const NavDiv = styled.div`
border: 1px solid blue;
position: relative;
width: 100%;
height: 100%;
font-size: 1rem;
padding: 4em 2em;
`
App Component
const App = () => {
return (
<Wrapper>
<Navbar></Navbar>
</Wrapper>
)
}
NavBar component
const Navbar = props => {
return (
<NavDiv>
</NavDiv>
)
}