Sign in

Sign up

Bootstrap Grid System is not working in Safari browser

MDB SupportCategory: General Bootstrap questionsBootstrap Grid System is not working in Safari browser
shejanbd Pro User asked 1 week ago, version:4


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>


shejanbd Pro User replied 1 day 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.

display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;

shejanbd Pro User replied 1 day ago

@Bartloiej Malanowski, I’m using Safari 5.1.7 version and I’ve also tested 2007 Macbook Pro but result is still same.

ermushin Pro User replied 2 days 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 also

Bartłomiej Malanowski replied 5 days ago

what is your version of Safari? What’s your device? Do you use iOS or Mac OS?