room homepage

Community feedback

• 

  AndresOreVel•370

  @AndresOreVel

  Posted 2 months ago

  I just have to say that doing it with Flex is quite complex, and not very precise. But it's still well done. In your container class, you can apply a display grid like this: display: grid; height: 100vh; grid-template-columns: [front] repeat(2, [col-start] 1fr [col-end]) .4fr 1fr [back]; grid-template-rows: 2fr .3fr 1fr; overflow: hidden; This way, you're giving each column a name, specifically where it starts and ends. Then, in each part of your code, for example in your "decor-image" class, you tell it where it starts and ends. grid-column: front / col-end 2; grid-row: 1 / 3; position: relative; By the way, the height: 100vh is so that it takes up the entire height of the screen. This way, you get a more precise design. Happy developing!

  00

  Marked as helpful