I have incorporated Bootstrap into my server-side web application to resize images for larger screens by adding padding to prevent them from getting too big. However, I'm unsure if this is the best approach. Are there better methods for resizing images?
<section class="pt-8 pt-md-11">
<div class="container">
<div class="row">
<div class="col-12 col-md-6 order-md-2 px-md-5 px-lg-9">
<img src="/img/myimage.pnh" class="img-fluid mb-6 mb-md-0" alt="">
</div>
<div class="col-12 col-md-6 order-md-1 text-center text-md-left">
<h2 class="display-3 font-weight-bold ">Save the World</h2>
<p class="text-muted">It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters</p>
</div>
</div>
</div>
</section>