Reputation: 6742
I want to make a background overlay within a child component. But even if I put the position
on absolute
it does not cover the whole page.
This is what I do in the css of my child component:
#background-overlay{
position: absolute !important;
display: block !important;
background-color: rgba(0, 0, 0, 0.5);
padding:0;
margin:0;
top:0;
left:0;
width: 100vh;
height: 100vw;
}
Stackblitz example: https://stackblitz.com/edit/angular-rjiujw
Upvotes: 1
Views: 912
Reputation: 164
The height and width are switched, they should be:
width: 100vw;
height: 100vh;
Upvotes: 1