Ich versuche, ein Bild in das erste Div der Seite einzufügen, aber aus irgendeinem Grund befindet es sich außerhalb der Seite. Alle Ressourcen befinden sich in Flexboxen. Wenn ich Text anstelle eines Bildes in dieses Div einfüge, funktioniert es einwandfrei.

Ich habe das Bild und das Div, von dem ich spreche, rot eingekreist. Dieser Codeausschnitt zeigt Ihnen nicht, wovon ich spreche, da es sich nicht um den vollständigen Code handelt.

.landing {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
 
}
.introWrapper {
  width: 1000px;
}

.intro1 {
  font-size: 25px;
  text-align: center;
  font-family: 'Yapari';
  align-items: center;
  justify-content: center;
  margin-top: 23px;
}
.intro2 {
  font-size: 25px;
  text-align: center;
  font-family: 'Yapari';
  /* font-weight: 72; */
  margin-top: 50px;
}
#introCircle {
  border: 2px solid black;
  border-radius: 50%;
  width: 230px;
  height: 70px;
  margin: auto;
}
.icons {
  border: 2px solid black;
  height: 50px;
}
.icon1 {
  width: 30px;
}

<div id='landing' className={styles.landing}>
      <div className={styles.introWrapper}> 
        <div className={styles.icons}>
          <img src={icon1} className={styles.icon1}/>
        </div>
        <div id={styles.introCircle}>       
          <h1 className={styles.intro1}>HELLO I'M</h1> 
        </div>       
        <LastName />
          <h1 className={styles.intro2}>A FULL STACK DEVELOPER</h1>
      </div>
    </div>