Просматривая код Zurb Foundation, я заметил, что они используют подход CSS, подобный этому, чтобы разрешить отзывчивый квадратный div:

.div{
    position:relative;
    width:33%;
    height:0;
    padding-bottom:33%;
}
.divInner{
    position:absolute;
    width:100%;
    height:100%;
}

Я использовал этот подход в некоторых новых проектах (все еще в частной разработке), но не знаю, поддерживает ли его браузер или почему высота даже может имитировать размер ширины. кто-нибудь знает, почему это произошло? Спасибо!