For example, to make a box responsive square, the following CSS adjustments are necessary.
.square { position: relative; width: 50%; } .square:after { content: ""; display: block; padding-bottom: 100%; } .content { position: absolute; width: 100%; height: 100%; }