In bootstrap css how does one fit an image or video automatically to all mobile devices based on its Resolution.
Add a comment |
1 Answer
For images, use Bootstrap's Responsive Images functionality. For video or embedded content, use Bootstrap's Responsive Embed to preserve the aspect ratio.
Example (JS Fiddle):
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/c/c5/%C3%84lvkarleby_June_2013.jpg/800px-%C3%84lvkarleby_June_2013.jpg" class="img-responsive"> <hr> <div class="embed-responsive embed-responsive-16by9"> <iframe class="responsive-embed" src="https://www.youtube.com/embed/SirRu8mf3II" > </iframe> </div> 