Skip to content

Instantly share code, notes, and snippets.

@tedshd

tedshd/img_width&height.html

Created June 19, 2013 02:04
Show Gist options
  • Save tedshd/5811160 to your computer and use it in GitHub Desktop.
Save tedshd/5811160 to your computer and use it in GitHub Desktop.
Download ZIP
bootstrap media object test
Raw
img_width&height.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet">
<title>Img_width&height</title>
<style>
img {
width: 200px; !important;
height: 200px; !important;
}
</style>
</head>
<body>
<ul class="media-list">
<li class="media">
<a class="pull-left" href="#">
<img class="media-object" data-src="holder.js/64x64" alt="64x64" width="64" height="64px" src="http://img.photobucket.com/albums/v205/ACHISTUDIO/DSC03539B-full.jpg">
</a>
<div class="media-body">
<h4 class="media-heading">Media heading</h4>
<p>Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.</p>
<!-- Nested media object -->
<div class="media">
<a class="pull-left" href="#">
<img class="media-object" data-src="holder.js/64x64" alt="64x64" src="http://img.photobucket.com/albums/v205/ACHISTUDIO/DSC03539B-full.jpg">
</a>
<div class="media-body">
<h4 class="media-heading">Nested media heading</h4>
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
<!-- Nested media object -->
<div class="media">
<a class="pull-left" href="#">
<img class="media-object" data-src="holder.js/64x64" alt="64x64" style="width: 64px; height: 64px;" src="http://img.photobucket.com/albums/v205/ACHISTUDIO/DSC03539B-full.jpg">
</a>
<div class="media-body">
<h4 class="media-heading">Nested media heading</h4>
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
</div>
</div>
</div>
</div>
<!-- Nested media object -->
<div class="media">
<a class="pull-left" href="#">
<img class="media-object" data-src="holder.js/64x64" alt="64x64" style="width: 64px; height: 64px;" src="http://img.photobucket.com/albums/v205/ACHISTUDIO/DSC03539B-full.jpg">
</a>
<div class="media-body">
<h4 class="media-heading">Nested media heading</h4>
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
</div>
</div>
</div>
</li>
<li class="media">
<a class="pull-right" href="#">
<img class="media-object" data-src="holder.js/64x64" alt="64x64" style="width: 64px; height: 64px;" src="http://img.photobucket.com/albums/v205/ACHISTUDIO/DSC03539B-full.jpg">
</a>
<div class="media-body">
<h4 class="media-heading">Media heading</h4>
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
</div>
</li>
</ul>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment