having a problem wrapping two <img> in the same <div> with two <p>

Question

im trying to put the second picture inside the div and wrap it with text like i did with the first image, sorry if the question is silly, i'm absolute beginner in this. can anyone help me to solve this? is making me crazy. i tried with the padding, margin, float and a lot of other things. and sorry for my english.

body {
  background-color: yellow;
  color: blanchedalmond;
  text-align: center;
  font-family: monospace;
  margin: 0;
}

.picture-of-me {
  display: fixed;
  height: 40%;
  width: 40%;
  border-radius: 30px;
}
.titleandphoto {
  background-color: rgba(31, 1, 28, 0.918);
  border-left-width: 50px;
  margin-left: 300px;
  margin-right: 300px;
  margin-bottom: 80px;
  margin-top: 64px;
  border-radius: 30px;
  padding-bottom: 1px;
}
h1 {
  font-size: 3.6251rem;
  margin-top: 0;
  margin-bottom: 10px;
}
#subtitle-under-the-photo {
  font-size: 20px;
  margin-bottom: 50px;
  margin-right: 100px;
  margin-left: 100px;
  padding-top: 0;
}
.fullstack {
  text-decoration: underline;
  font-weight: bold;
}
hr {
  border-width: 20px;
  border-style: dotted;
  border-right: 0;
  border-bottom: 0;
  border-left: 0;
  margin: 80px 500px 80px 500px;
}
.container-programming-skills {
  background-color: rgba(31, 1, 28, 0.918);
  border-left-width: 50px;
  margin-left: 300px;
  margin-right: 300px;
  margin-bottom: 80px;
  margin-top: 64px;
  border-radius: 30px;
  padding-bottom: 1px;
}
.photo-programming-skills-top {
  height: 76px;
  width: 76px;
  float: left;
  margin-right: 10px;
  padding: 57px 0px 0px 10px;
}
.photo-programming-skills-bottom {
  height: 76px;
  width: 76px;
  float: right;
  margin-right: 10px;
  padding-top: 72px;
}
h3 {
  font-weight: bold;
  font-size: 30px;
  margin-right: 80px;
  margin-bottom: 0px;
  padding-top: 10px;
}
p {
  text-align: left;
  font-size: 15px;
  line-height: 1;
  margin-left: 10px;
  margin-right: 10px;
}

<section id="skills-row">
        <div class="container-programming-skills">
          <img class="photo-programming-skills-top"
            src="https://image.flaticon.com/icons/svg/2905/2905977.svg"
          />
          <h3>My Skills</h3>
          <p>
            I started to code when i was 27 years old, just for fun, to make
            games for my friends or websites for his personal profiles or stores
            and i started to think "well i do this for fun and i enjoy it, so
            why not give my time to build things for other people outside my
            circle?" and that was the way my journey started.
          </p>
          <p>
            I'm a full stack developer, i'm highly experienced using the
            classical language like html, CSS and Javascript also frameworks
            like Bootstrap or libraries like Jquery, also i have experiences
            using Node.js, SQL, Express.js, building API's and in the last time
            i started to get more experience with my new love Python.
          </p>
          <img
            class="photo-programming-skills-bottom"
            src="https://image.flaticon.com/icons/svg/888/888969.svg"
            alt="web picture"
          />
        </div>
</section>

Answer 1

You can resolve this issue by two changes,

1. Keep your second image inside your second

   tag and

2. change the padding-top of your second image to ,

   padding-top: 0px;

body {
  background-color: yellow;
  color: blanchedalmond;
  text-align: center;
  font-family: monospace;
  margin: 0;
}

.picture-of-me {
  display: fixed;
  height: 40%;
  width: 40%;
  border-radius: 30px;
}
.titleandphoto {
  background-color: rgba(31, 1, 28, 0.918);
  border-left-width: 50px;
  margin-left: 300px;
  margin-right: 300px;
  margin-bottom: 80px;
  margin-top: 64px;
  border-radius: 30px;
  padding-bottom: 1px;
}
h1 {
  font-size: 3.6251rem;
  margin-top: 0;
  margin-bottom: 10px;
}
#subtitle-under-the-photo {
  font-size: 20px;
  margin-bottom: 50px;
  margin-right: 100px;
  margin-left: 100px;
  padding-top: 0;
}
.fullstack {
  text-decoration: underline;
  font-weight: bold;
}
hr {
  border-width: 20px;
  border-style: dotted;
  border-right: 0;
  border-bottom: 0;
  border-left: 0;
  margin: 80px 500px 80px 500px;
}
.container-programming-skills {
  background-color: rgba(31, 1, 28, 0.918);
  border-left-width: 50px;
  margin-left: 300px;
  margin-right: 300px;
  margin-bottom: 80px;
  margin-top: 64px;
  border-radius: 30px;
  padding-bottom: 1px;
}
.photo-programming-skills-top {
  height: 76px;
  width: 76px;
  float: left;
  margin-right: 10px;
  padding: 57px 0px 0px 10px;
}
.photo-programming-skills-bottom {
  height: 76px;
  width: 76px;
  float: right;
  margin-right: 10px;
  padding-top: 0px;
}
h3 {
  font-weight: bold;
  font-size: 30px;
  margin-right: 80px;
  margin-bottom: 0px;
  padding-top: 10px;
}
p {
  text-align: left;
  font-size: 15px;
  line-height: 1;
  margin-left: 10px;
  margin-right: 10px;
}

<section id="skills-row">
        <div class="container-programming-skills">
          <img class="photo-programming-skills-top"
            src="https://image.flaticon.com/icons/svg/2905/2905977.svg"
          />
          <h3>My Skills</h3>
          <p>
            I started to code when i was 27 years old, just for fun, to make
            games for my friends or websites for his personal profiles or stores
            and i started to think "well i do this for fun and i enjoy it, so
            why not give my time to build things for other people outside my
            circle?" and that was the way my journey started.
          </p>
          <p>
            <img
            class="photo-programming-skills-bottom"
            src="https://image.flaticon.com/icons/svg/888/888969.svg"
            alt="web picture"
          />
            I'm a full stack developer, i'm highly experienced using the
            classical language like html, CSS and Javascript also frameworks
            like Bootstrap or libraries like Jquery, also i have experiences
            using Node.js, SQL, Express.js, building API's and in the last time
            i started to get more experience with my new love Python.
            
          </p>
          
        </div>
</section>

Answer 2

You did. Just remove the padding top of the second image, or if you want you can add negative value or padding bottom. And move it above one or two paragraphs.