Add responsive embed class with ratio by variable
Created by: thenewguy
It would be handy if there was support for a variable ratio.
For example,
<style>
.embed-responsive-by-ratio::before {
padding-top: 56.25%; /* 16:9 fallback when var() not supported */
padding-top: var(--embed-responsive-by-ratio);
}
</style>
<div class="embed-responsive embed-responsive-by-ratio" style="--embed-responsive-by-ratio: 17.8%;"></div>
When templating a known width and height it is simpler to calculate the padding than determine which of your classes is a closer fit.
Didn't see this in the documentation but it is pretty simple and working for me - would probably be generally useful