.containerBox { max-width: 720px; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "topper" "intro" "sidebar" "content"; row-gap: 8px; @media (min-width: 1012px) { max-width: none; padding-top: 24px; grid-template-rows: auto 1fr; grid-template-columns: minmax(500px, 720px) minmax(220px, 1fr); grid-template-areas: "topper sidebar" "intro sidebar" "content sidebar"; column-gap: 80px; row-gap: 0; } } .sidebarBox { @media (min-width: 1012px) { position: sticky; padding-top: 24px; top: 5em; max-height: calc(100vh - 5em); overflow-y: auto; padding-bottom: 40px !important; } }