css – Example of uniform placement of elements horizontally

I've recently started learning CSS and when reading code in W3Schools, I came across this example:

https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_calendar

To evenly distribute the elements horizontally, the first operation I can think of is width: calc (100% / no_of_elements)

However, the different values ​​used for different support requests for the width key are not given by this formula. How should we draw something like this?

Also, since% is relative, why do we have to change the percentages of width relative to the size of the screen? If the screen decreases, the percentage should not decrease in the same proportions?