AspectRatio
The AspectRatio
component is used to embed responsive videos, maps, images, etc. It
uses a very common padding hack to achieve this.
Import
Embed Video
To embed a video with a specific aspect ratio, use an iframe with src
pointing
to the link of the video.
Editable Example
Embed Image
Here's how to embed an image that has a 4 by 3 aspect ratio.
Editable Example
Embed a map
Here's how to embed a responsive Google map using AspectRatio
.
Editable Example
Props
Name | Type | Default | Description |
---|---|---|---|
ratio | number | 16 / 9 | The aspect ratio of the content. |