Topic: Bootstrap Grid System is not working in Safari browser
HI,
The Bootstrap 4 grid system is not working in Safari browser. Whatever I use column class, it falls in a single column.
<div class="row"> <div class="col-4">Column 4</div> <div class="col-4">Column 4</div> <div class="col-4">Column 4</div> </div>
Add code below .row{ &:before, &:after{ display: block; } } row will not preserve its height depending on the elements inside it,
In safari it's not working for me. showing error "shrink-to-fit" not recognized or ignored.
Still I have added the shrink-to-fit=no" still getting error.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Pro
- Premium support: No
- Technology: General Bootstrap questions
- MDB Version: -
- Device: -
- Browser: -
- OS: -
- Provided sample code: No
- Provided link: No
Bartłomiej Malanowski staff commented 7 years ago
what is your version of Safari? What's your device? Do you use iOS or Mac OS?ermushin pro commented 7 years ago
Hi. I have a such problem too. My devidce is ipad A1395. The problem is appeared in all browsers I have(safari, chrome) with my site. OS version is 8.1(12b410). The same trouble I can see on mdbootstrap site alsoshejanbd pro commented 7 years ago
@Bartloiej Malanowski, I'm using Safari 5.1.7 version and I've also tested 2007 Macbook Pro but result is still same.shejanbd pro commented 7 years ago
@ermushine after searching for hours over the internet, I've found the following solution. I've added the following class rowsafari with the row class and it is working but I do not it is still the best solution for my problem. .rowfafari{ display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }