css - Twitter Bootstrap in Drupal 7 columns not lining up in Safari -


i have bootstrap module installed. have made custom tpl files layout of views strip out unnecessary divs structure follows:

<body>     <div class="mysection">         <div class="container">             <h2>title</h2>             <div class="row">                 <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">                     <a href="linktocontent">                         <div>                             <img src="contentimg" class="img-responsive"/>                         </div>                     </a>                 </div>             </div>         </div>     </div>    

i'm tearing hair out because @ 992px - 1199px in safari, , 1200px + in chrome second line of columns out. 4th column floating right , 5th , 6th floating left below 4th this:

[ 1 ] [ 2 ] [ 3 ]              [ 4 ]  [ 5 ] [ 6 ] 

it's fine 991px , lower in both browsers.

i had assumed there within divs throwing out padding or column width, or i've had problems straight bootstrap , html projects content of column, despite fitting ok visually, has pushed columns out in similar way. so, i've stripped right down , taken out own css , of content, it's worse before (it had been fine in chrome).

i've had success taking guttering off rows that's caused problems in other areas.

now wondering if bootstrap drupal more trouble it's worth , should instead use simple grid system responsive grid system. advice or welcome!

this typically happens when 1 (or some) of columns different in vertical size. fix should use rows bootstrap provides , enclose every 3 columns in different row.


Comments

Popular posts from this blog

Email notification in google apps script -

c++ - Difference between pre and post decrement in recursive function argument -

javascript - IE11 incompatibility with jQuery's 'readonly'? -