Home > Blockchain >  I am unable to add images horizontally in my bootstrap website
I am unable to add images horizontally in my bootstrap website

Time:02-24

i'm using bootstrap 5 and the images are not getting aligned in horizontal way. The image gets added in the lower row. i've tried everything nut it dosent's works. any help would be appriciated. Thank you.

<!-- Bootstrap-5 -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" />


<!-- Body -->
<section>
  <div  >
    <div >
      <div >
        <h3> Lots of IT companies in town. Why you should choose us? </h3>
      </div>
    </div>
  </div>
  <hr>
</section>



<div >
  <div >
    <img  src="https://via.placeholder.com/200.jpg" width="150">
    <h4 style="font-weight: 700;">Customized requirements</h4>
    <p> Every idea is unique and that's we craft it as<br> per your requirements.</p>
  </div>
</div>

<div >
  <img  src="https://via.placeholder.com/200.jpg" width="150">
  <h4 style="font-weight: 700;">Customized requirements</h4>
  <p> Every idea is unique and that's we craft it as<br> per your requirements.</p>
</div>



</section>

CodePudding user response:

row div early close

<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" />
<section>
    <div  >
        <div >
            <div >
                <h3> Lots of IT companies in town. Why you should choose us? </h3>
            </div>
        </div>
    </div>
    <hr>
</section>
<div  >
    <section>
        <div >
            <div >
                <img  src="images/our qualities/our_qualities/customized.png" width="150">
                <h4 style="font-weight: 700;">Customized requirements</h4>
                <p> Every idea is unique and that's we craft it as<br> per your requirements.</p>
            </div> <!-- Not Here -->

            <div >
                <img  src="images/our qualities/our_qualities/customized.png" width="150">
                <h4 style="font-weight: 700;">Customized requirements</h4>
                <p> Every idea is unique and that's we craft it as<br> per your requirements.</p>
            </div>
        </div> <!-- Close Here -->
    </section>
</div>

  • Related