main { --main-height : 400px; --main-width : 400px; position : relative; width : var(--main-width); height : var(--main-height);; background-color : yellow; border-radius : 10px; border: 4px solid red; margin:auto; } section { position : absolute ; top : calc(var(--main-height) / 4 ); right:calc(var(--main-width) / 5); width : calc(var(--main-height) / 4); height : calc(var(--main-height) / 4); height : calc(var(--main-height) / 4); border-radius : calc(var(--main-height) / 4); background-color : red; } aside { position : absolute ; top : calc(var(--main-height) / 4 ); left:calc(var(--main-width) / 5); width : calc(var(--main-height) / 4); height : calc(var(--main-height) / 4); height : calc(var(--main-height) / 4); border-radius : calc(var(--main-height) / 4); background-color : red; } footer { position : absolute; bottom : calc(var(--main-height) / 8 ); --tmp-left : calc(var(--main-width) / 5); left : var(--tmp-left); height : calc(var(--main-height) / 6); width : calc(var(--tmp-left) * 3 ); background-color : red; }