Bskin Bootstrap 5 skin ui kit

Media Object

Documentation and examples for Bootstrap’s media object to construct highly repetitive components like blog comments, tweets, and the like.

Deafult Media object

media
This is some content from a media component. You can replace this with any content and adjust it as needed.
media
This is some content from a media component. You can replace this with any content and adjust it as needed.
media
This is some content from a media component. You can replace this with any content and adjust it as needed.
      <div class="d-flex mb-4">
      <div class="flex-shrink-0">
      <img src="images/t1.jpg" class="img-fluid rounded-circle" title="media" alt="media">
      </div>
      <div class="flex-grow-1 ms-3">
      This is some content from a media component. You can replace this with any content and adjust it as needed.
      </div>
      </div>
      <div class="d-flex mb-4">
      <div class="flex-shrink-0">
      <img src="images/t2.jpg" class="img-fluid rounded-circle" title="media" alt="media">
      </div>
      <div class="flex-grow-1 ms-3">
      This is some content from a media component. You can replace this with any content and adjust it as needed.
      </div>
      </div>
      <div class="d-flex mb-4">
      <div class="flex-shrink-0">
      <img src="images/t3.jpg" class="img-fluid rounded-circle" title="media" alt="media">
      </div>
      <div class="flex-grow-1 ms-3">
      This is some content from a media component. You can replace this with any content and adjust it as needed.
      </div>
      </div>
                           

vertically center Media object

media
This is some content from a media component. You can replace this with any content and adjust it as needed.
media
This is some content from a media component. You can replace this with any content and adjust it as needed.
media
This is some content from a media component. You can replace this with any content and adjust it as needed.
      <div class="d-flex align-items-center mb-4">
      <div class="flex-shrink-0">
      <img src="images/t1.jpg" class="img-fluid rounded-circle" title="media" alt="media">
      </div>
      <div class="flex-grow-1 ms-3">
      This is some content from a media component. You can replace this with any content and adjust it as needed.
      </div>
      </div>
      <div class="d-flex align-items-center mb-4">
      <div class="flex-shrink-0">
      <img src="images/t2.jpg" class="img-fluid rounded-circle" title="media" alt="media">
      </div>
      <div class="flex-grow-1 ms-3">
      This is some content from a media component. You can replace this with any content and adjust it as needed.
      </div>
      </div>
      <div class="d-flex align-items-center  mb-4">
      <div class="flex-shrink-0">
      <img src="images/t3.jpg" class="img-fluid rounded-circle" title="media" alt="media">
      </div>
      <div class="flex-grow-1 ms-3">
      This is some content from a media component. You can replace this with any content and adjust it as needed.
      </div>
      </div>
                           

© Copyright-2022 DesignCollection.in. All rights reserved.