Hello,
I am embedding Vimeo videos in a card. However they don’t seem to be responsive and “flows out” off the card boundaries.
<div class="page-content">
<div class="card card-outline">
<div class="card-header">Features</div>
<div class="card-content card-content-padding">
<iframe src="https://player.vimeo.com/video/1" width="640" height="361" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe> <p><a href="https://vimeo.com/1">Features Vedio</a> from <a href="https://vimeo.com/user1">John</a> on <a href="https://vimeo.com">Vimeo</a>.</p>
</div>
</div>
<div class="card card-outline">
<div class="card-header">Activity</div>
<div class="card-content card-content-padding">
<iframe src="https://player.vimeo.com/video/2" width="640" height="357" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe> <p><a href="https://vimeo.com/1">Activity Vedio</a> from <a href="https://vimeo.com/user2">John</a> on <a href="https://vimeo.com">Vimeo</a>.</p>
</div>
</div>
</div>
Any ideas on how to achieve “responsiveness” ?