Responsive Foundation 6.0.0

A mixin for creating aspect ratios. Apply this mixin to the container that should be scalable in size, such as a video wrapper or an image wrapper. This will ensure the targeted element scales in size relative to its parent's width. It then absolutely positions the immediate child of this element so it fills the aspect ratio container.

Examples

Adds aspect-ratio styling to a parent element and absolute positions its immediate child.

					$width: 200;
					$height: 150;
					.foo {
						@include aspect-ratio( $width, $height );
					}