Sinan Samet
Sinan Samet

Reputation: 6742

Child component doesn't cover whole page

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

Answers (1)

iProgramGUIs
iProgramGUIs

Reputation: 164

The height and width are switched, they should be:

width: 100vw;
height: 100vh;

Upvotes: 1

Related Questions