I'm facing a peculiar issue that seems simple at first glance, but has me stumped.
On a webpage using Bootstrap, there's a div with the following code:
.appSection{
background-color: #000000;
padding:20px;
border:1px solid #67c1dd;
margin-bottom: 30px;
display: block;
width: 100%;
min-height: 450px;
}
This div is a child of a div wrapper with col-md-12.
While it displays correctly on most browsers, on the iPad, if there isn't much content at the top of the div, it collapses to the right, as shown in the attached image. Sometimes, it can even collapse almost completely behind the underlying menu.
Any ideas on what might be causing this issue? https://i.sstatic.net/eQusL.png