.row {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-right: -15px;
margin-left: -15px;
}
Recently, we implemented Bootstrap 4 and the Flex model at my company. We've encountered some strange behavior when using Bootstrap and Autoprefixer together.
The issue seems to be with older iPad versions (8 or below) not rendering properly due to the display: -webkit-box;
CSS property. While I can prevent autoprefixing on the problematic class by adding /* autoprefixer: off */
, I prefer not to modify the core Bootstrap files and would like to maintain other prefix support.
I'm seeking suggestions to gracefully override or remove the display: -webkit-box
attribute specifically. Are there any customization options within Autoprefixer that could help address this issue? Any insights from the community would be highly appreciated!