Final project css - Calc

Knowing that I have a grid, I would like to know what is the usability of this:

height: calc(100% - 6.8rem);

It’s important to know that it’s a project section, where images are shown with the title of each project. I was following the example given for this project about a portfolio, wich contains 6 images and that is the height but I’m a little bit confused. Thanks!

It is setting the image height to 100% minus the height of the .project-title element that it shares the space of the container with.

The base font size was set to 62.5% which makes 1rem computed to 10px, so 6.8rem is 68px which as said is the height of the .project-title element (well technically it looks to be calculated to 67.9972px but close enough).

1 Like

thank you very much for your answer!

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.