Project: tailwind
Task (easy): add divs(class 'header', 'footer', 'content') with arbitrary text in '.root' element. '.root' occupies total viewport and children elements together occupy total '.root' space. header (border-box) is always fixed at the top of '.root'; footer (border-box) is always fixed at the bottom of '.root'; content (border-box) occupies the remaining '.root' space. USE tailwind grid only, NO flex, float and position, NO js.