Tuesday, November 14, 2023

Card Bootstrap - with mobile UI-

 <div class="card-group">

  <div class="card">

    

    <div class="card-body">

      <div class="card-title">Card title</div>

      <div class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</div>

        <a href="#" class="btn btn-primary">Go somewhere</a>

    </div>

    

  </div>

  <div class="card">

    

    <div class="card-body">

      <h5 class="card-title">Card title</h5>

      <p class="card-text">This card has supporting text below as a natural lead-in to additional content.</p>

    </div>

    

  </div>

  <div class="card">

    

    <div class="card-body">

      <h5 class="card-title">Card title</h5>

      <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This card has even longer content than the first to show that equal height action.</p>

    </div>

    

  </div>

</div>

===================================================

reference:-https://getbootstrap.com/docs/5.2/components/card/

https://stackoverflow.com/questions/34140793/bootstrap-4-responsive-cards-in-card-columns

No comments:

Post a Comment