How to create card deck using bootstrap?

 


Each card in card deck has equal width and height and are not attached to each other. Below is the sample code snippet to create card deck:

<div class="card-deck">
    <div class="card">
        <img src="images/example.jpg" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Card title</h5>
            <p class="card-text">This is testfry.com site.</p>
        </div>
        <div class="card-footer">
            <small class="text-muted">Last updated 3 mins ago</small>
        </div>
    </div>
    <div class="card">
        <img src="images/example.jpg" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Card title</h5>
            <p class="card-text">This is testfry.com site.</p>
        </div>
        <div class="card-footer">
            <small class="text-muted">Last updated 3 mins ago</small>
        </div>
    </div>
    <div class="card">
        <img src="images/example.jpg" class="card-img-top" alt="...">
        <div class="card-body">
            <h5 class="card-title">Card title</h5>
            <p class="card-text">This is testfry.com site.</p>
        </div>
        <div class="card-footer">
            <small class="text-muted">Last updated 3 mins ago</small>
        </div>
    </div>
</div>

 


Related #tags:     #bootstrap     #html     #css    

Related questions




Looking for change? Click below to prepare for technical interview.


Technical Interview Questions