html - DIV 'flex-box' 元素超出边界 iOS

Question

好的，我遇到了一个以前从未遇到过的问题。 我有一个 h1 和一个带有内容的 p 标签，全部包装在一个名为 .mainwrapper 的 div 中，然后再次包装在另一个带有 .main 类的 div 中以创建边框效果。
CSS

p
{
  font-family:Play;
  width: 90%;
  height: auto;  
  margin:0 auto;
  font-size:22px;
}

h1
{
  font-family:Stardos Stencil;
  font-size:48px;
  width: 90%;  
  margin:0 auto;  

}
.main
{
display: flex;
display: -webkit-flex;
display: -ms-flexbox;
flex-direction: column;
padding-top:40px;
padding-bottom:40px;
z-index: 20;
width: 100vw;
right: 0;
left: 0;
height: auto;
margin: 0 auto;
text-align: center;
background:rgb(30,30,30);
color: white;
position: relative;
transition: visibility 2s, opacity 1s linear;
box-shadow:0 -8px 8px rgb(0,0,0);
}
.mainwrapper
{
display: flex;
display: -webkit-flex;
display: -ms-flexbox;
over-flow: contain;
flex-direction: column;
position: relative;
width: 90vw;
height: auto;
background-color: rgba(0,0,0,0.3);
margin:0 auto;
}

HTML

   <div class="main">
    <div class="mainwrapper">
      <h1>About Us</h1>
      <br>
      <p>Based in Greeley, Colorado and Operating In and Around the Greater Wattenberg Shale and DJ Basin. We Specialize in BOP Stack Testing, BOP and Accumulator Service and Repair, Gate Valve Repair, Hydraulic  Torque Wrench Service, Production Completion and Much More. <a href="contact.php">Just Ask!</a> Pathfinder Pressure is a Veteran Owned and Operated Business, We bring Integrity and Experience to Every Drilling and/or Completion Operation.  Our Equipment is State of the Art, Thoughtfully Engineered, and Meticulously Maintained. We Arrive On Time, Ready to Work, with Safety as Our First Priority in Everything We Do. We Maintain a Flawless Safety Record with ZERO Recordable Incidents, That's a Record We Plan to Keep.</p><br>
    </div>
   </div>

我将两个 div 的高度设置为自动，以便元素响应。这在桌面浏览器上效果很好，但在我的 iphone 7 上，段落内容突出了两个 div 的底部边框。我可以使用媒体查询并将 .mainwrappers 高度设置为 700px 来解决这个问题，但就我而言，这并不是真正的“响应式”方法，我想知道其他人是否做了什么来解决这个问题？ 谢谢

Answer 1

Kellen Lester 在其回答下方的评论中是正确的。 对于阅读本文的任何人，不要对每个 div 使用 display:flex-box。 Safari iOS 不喜欢它。