即使屏幕调整大小，如何使宽度较小的文本保留在100％宽度的图像上？

Question

如果屏幕调整大小，如何使宽度较小的文本保留在100％宽度的图像上？我希望文本保留在后台。当我使屏幕尺寸变小时，文字出现在图像之外，我尝试了一切，但我找不到一个好的解决方案。请帮忙！

HTML（Ruby on Rails）

<div class="outer-wrapper">
 <%= image_tag("x.png" class="background") %>
  <div class="inner-wrapper">
   <p> Feel free to reach out to me with anything that’s on your mind. I’m always
   happy to hear from people and I’ll respond as quickly as possible. </p>
 </div>
</div>

CSS部分

.outer-wrapper {
}

.background {
min-width: 100%;
margin: 0 auto;
display: block;
position: relative;
height: 900px;
}

.inner-wrapper {
width: 41%;
height: 100%;
margin: 2% auto;
left: 0; 
right: 0;
position: absolute;
top: 172%;
}