6

Bunu çözmeye çalışırken günlerimi harcadım ve zihnimin sonuna geldim. Herhangi bir içgörü varsa, çok minnettar olurum.Jquery Isotope kullanırken Bootstrap 3 sütununda sorun (Safari'de iyi ama!)

Bir sitede çalışıyorum ve Bootstrap 3 ve Jquery Isotope'u kullanıyorum. Dört sütunda div'leri düzenlemek için Bootstrap 3'ün ızgarasını kullanıyorum. İzotop filtresini divlara uygulayana kadar herşey yolunda. Bunu yaptıktan sonra, Chrome'da, sağ tarafta büyük bir boşluk bulunan üç sütun düzeni olur. Boşluklar aynı genişlikte kalıyormuş gibi görünür - sadece dört yerine üçten sonra kırılırlar. Çıldırtıcı şey, her şey Safari'de iyi çalışıyor gibi görünüyor!

İşte farkın bir örneğidir. Safari (doğru): Safari

Krom (yanlış): Chrome

ben her şeyi denedim ve bulduğum tek "çözüm" üzerinde padding-left ve padding-hakkını değiştirmektir. İzotop elemanlarını içeren kapsayıcı div. 0 Bunu yapmak istemiyorum, çünkü o zaman diğer izotop içeren .container div'ler düzgün bir şekilde hizalanmayacaktır.

Gerçekten verebileceğin herhangi bir yardımı gerçekten takdir ediyorum!

: Burada
<div class="container"> 
    <div class="row iso"> 
     <div class="col-sm-3 iso-item" style="padding-bottom: 20px;"> 
      <div style="background-color: green;"> 
       <p>The quick brown fox jumped over the lazy dog. The quick brown fox jumped over the lazy dog. The quick brown fox jumped over the lazy dog. The quick brown fox jumped over the lazy dog. </p> 
      </div> 
     </div> 
    </div> 
</div> 

İzotop script: Burada http://jsfiddle.net/kECqL/5/

temel html: Ben gerçekten bu bir bilemiyorum ... Ben göstermek için bir temel Jsfiddle oluşturduk Şu anda çalıştığım bir projede

cevap

13

aynı sorunu yaşıyordu. Sadece .col-sm-3 ile, 2 veya 4 ise iyi çalışır. Tuhaf.

.col-sm-3 { 
    margin-right: -1px; 
} 

Alkış: Benim basitçe Bootstrap CSS dosyası üzerinde geçersiz kılınmış olarak aşağıdaki CSS ekleyerek edilmiş

Neyse, bunu yaptı!

+0

Bu benim için çalıştı, teşekkürler – Haris

+0

Aynı sorunu Firefox ve Chrome'da görüyorum. Bu iş benim için çalışıyor. – adarshr