Arkadaşlar aşağıdaki kodda her şey güzel görünürken sayfaya telefonda baktığımda görsel kesiliyor. Kodda nereyi yanlış yapıyorum?

<div style="display: flex; align-items: center; padding: 0;">
<div style="position: relative; background-color: #d3d3d3; border-radius: 10px; padding: 10px 20px; color: black; width: 100%; margin-right: 20px;">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Perspiciatis placeat nobis corporis eos voluptas molestiae deserunt quam facere iste quasi laboriosam similique autem consequatur aspernatur quas dignissimos, in, necessitatibus accusantium.
<div style="content: ''; position: absolute; top: 50%; right: -20px; border-width: 10px; border-style: solid; border-color: transparent transparent transparent #d3d3d3; transform: translateY(-50%);">&nbsp;</div>
</div>

<div style="width: 150px; height: 150px; background-color: #f0f0f0; display: flex; justify-content: center; align-items: center; border-radius: 8px; overflow: hidden; margin: 0; padding: 0;"><img alt="Görsel" height="350" src="/images/uploaded/bitki.jpg" style="width: 150px; height: 150px; object-fit: cover;" width="320" /></div>