what is the correct code for changing the dimensions of the background in css?

Asked Nov 08 '22 at 21:25

Active Nov 08 '22 at 21:44

Viewed 34 times

I am learning working with BootStrap and in one of the exercises I have a problem with finding a CSS code.
I just want to know as you see in the photo how to fill the top right part of the page with the black background? but keep the right part of the black background slided?
and the main background is a video, how can I make it mate(not shiny)?

here is the css code and also the screenshot of what it is and what it should be:

body:before {
  position         : absolute;
  box-sizing       : border-box;
  top              : 0;
  left             : 0;
  height           : 100%;
  width            : 70%;
  background-color : rgba(0, 0, 0, 0.95);
  opacity          : 0.95;
  transform        : matrix(1, 0, -0.158384, 1, 0, 2);
  z-index          : 1;
  content          : " ";
  display          : block;
  margin-right     : 40%;
}

what it is... :-/

what it should be

I just want to know as you see in the photo how to fill the top right part of the page with the black background? but keep the right part of the black background slided?
and the main background is a video, how can I make it mate(not shiny)?

edited Nov 08 '22 at 21:44

Mister Jojo

20,093
6
21
40

asked Nov 08 '22 at 21:25

Saman Salimzade

Hey Saman, We cant see your image – Nephter Nov 08 '22 at 21:39
Do you mean keep the top left part of the page black, rather than showing that bit of the background image? – A Haworth Nov 08 '22 at 21:41
@Nephter I just uploaded the image again, Can you see now? – Saman Salimzade Nov 08 '22 at 21:44
@AHaworth , Yes exactly that is what I mean – Saman Salimzade Nov 08 '22 at 21:45
so why don't you nudge the black div a little `left`? – IT goldman Nov 08 '22 at 21:47
Where is the video positioned? Is it the content of body or on another div or... – A Haworth Nov 08 '22 at 21:47
https://stackoverflow.com/help/formatting. The **real** one who delivered your readable markDown --> – Mister Jojo Nov 08 '22 at 21:50
my guess is, in your Transform: matrix (...) the number that is negative. maybe change it to 1 or 0 and see if that helps. let me know – Nephter Nov 08 '22 at 21:51
also, what part are you wanting to make matte (not shiny)? the video background portion? if so, there are a few ways of doing this but id like to clarify first E> – Nephter Nov 08 '22 at 21:53
What do you want on viewports with various aspect ratios? Is the important thing to have the black at that angle of slope or to have it those % distances from the left side at the top and the bottom? – A Haworth Nov 08 '22 at 21:56
@ITgoldman , I can not nudge it because as you see the bottom part of background is at the left end – Saman Salimzade Nov 08 '22 at 22:00
@AHaworth , Video is a part of the body – Saman Salimzade Nov 08 '22 at 22:00
change width to 80% and margin-right to 45% – Nephter Nov 08 '22 at 22:01
@Nephter , I changed the numbers, but the completely change the shape of it – Saman Salimzade Nov 08 '22 at 22:02
@Nephter , The video background portion I want to be matte – Saman Salimzade Nov 08 '22 at 22:03
@AHaworth I want to keep the right angle but remove the left part] – Saman Salimzade Nov 08 '22 at 22:05
@Nephter Thanks, I am in class now, I am gonna try it and be back – Saman Salimzade Nov 08 '22 at 22:07
transform-origin: top left – Temani Afif Nov 08 '22 at 22:54

what is the correct code for changing the dimensions of the background in css?

0 Answers0