A fr
unit in CSS is a “fragment” unit. It is a relative length unit that specifies the fraction of the width of the containing block that a contained block should occupy.
For example, if you have a containing element with a width of 400px and you specify a child element to be two fr units wide, then that child element will occupy 200px (half) of the width of its parent.