Bootstrap Align Media objects Examples

First Page
Next Page

Bootstrap Align Media Objects Examples

<!DOCTYPE html>
<html>
   <head>
      <title>Bootstrap Example</title>
      <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
   </head>
   <body>
      <div class="container">
         <h2>Bootstrap Tutorial</h2>
         <div class="media">
            <div class="media-left">
               <img src="http://tutorialsroot.com/bootstrap/src/carousel.jpg" class="media-object" style="width:60px; height:100px">
            </div>
            <div class="media-body">
               <h4 class="media-heading">Introduction</h4>
               <p>Bootstrap 4 is the newest version of Bootstrap, which is the most popular HTML, CSS, and JavaScript framework for developing responsive, mobile-first websites</p>
            </div>
         </div>
      </div>
   </body>
</html>

Output

First Page
Next Page