displaying the text right next to the icon

I am trying to display the text right next to the icon:

This is the icon:

when I put the text right next to the icon. First line that says "testing: is simple dummy...." is coming in the middle of the icon, but next line that says "an unknown printer...." comes underneath the icon. I want second line underneath the first line. Please see the image below:

This is how my code looks like:

  <div class="row" style="display:flex;">
            <div class="col">
                <img src=" https://i.sstatic.net/Ir7Kl.png" height="50px" width="50px" />
            <span style="font-size:20px;font-weight:bold">Testing:</span> is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make  when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.<br />
            </div>
        </div>

I also tried writing the code this way:

<div class="row" style="display:flex;">
    <div class="col-auto">
        <img src="https://i.sstatic.net/Ir7Kl.png" height="50px" width="50px" />

    </div>
    <div class="col-auto">
        <span style="font-size:20px;font-weight:bold">Test test1:</span> is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make  when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.<br />
    </div>
</div>

The above code did not work either. with this code, the entire text is coming underneath the image.

I want the text right next to the image instead of underneath the image.

Solution

It depends if the whole text as a block should be right if the image or if the text should float.

Version 1: Float:

img {
  float: left;
  margin: 0 10px 2px 0;
}

<div class="row" style="display:flex;">
  <div class="col">
    <img src=" https://i.sstatic.net/Ir7Kl.png" height="50px" width="50px" />
    <span style="font-size:20px;font-weight:bold">Testing:</span> is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type
    and scrambled it to make when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.<br />
  </div>
</div>

Version 2: Seperate blocks (using display: contents on the span to make it part of the second flex child:

.col.x>img {
  margin: 0 10px 0 0;
}

.col.x {
  display: flex;
}

.col.x>span {
  display: contents;
}

<div class="row" style="display:flex;">
  <div class="col x">
    <img src=" https://i.sstatic.net/Ir7Kl.png" height="50px" width="50px" />
    <span style="font-size:20px;font-weight:bold">Testing:</span> is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type
    and scrambled it to make when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.<br />
  </div>
</div>

But actually I would recommend to modify the HTML structure to avoid the necessity of display: contents on the span. Just create a common container for the whole text which will serve as the second flex child:

.col.x>img {
  margin: 0 10px 0 0;
}

.col.x {
  display: flex;
}

<div class="row" style="display:flex;">
  <div class="col x">
    <img src=" https://i.sstatic.net/Ir7Kl.png" height="50px" width="50px" />
    <div>
      <span style="font-size:20px;font-weight:bold">Testing:</span> is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type
      and scrambled it to make when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.<br />
    </div>
  </div>
</div>