Duvar Izgara Kırık Düzeni ben şöyle gider bir görüntü düzeni olması yığma ızgara kullanıyorum

Question

Başlatılıyor:

1 satır - iki resim 50/50%

2 row- üç görüntüleri 33.33/33.33/33.33%

3. sıra - iki resim 50/50%

başlatılıyor ve sadece CSS ile stil önce, düzen güzel çalışıyor. Görüntüleri yüklendikten sonra veya olmadan yüklendikten sonra, düzeni bozar.

.grid-sizer, 
    .grid-item { 
     width: 33.33%; 
    } 

Ben% 25'e yukarıda değiştirirseniz

http://codepen.io/byoungz/pen/JXOKqW

, üç sütun görüntüler güzel dördüncü görüntü için bir boşluk bırakarak sıraya. % 50 genişlikteki görüntüler buna göre üst ve alt kısımlara taşınır.

İki öğeyi% 50 oranında kaldırırsam ve% 33.33 öğeden bile ayrılırsam, bunlar bir satırda sıraya dizilmiş gibi görünüyor.

Bu düzene sahip olmak mümkün değil mi? Kolayca çalışabilmem için çok şey kazandım.

Answer 1

Sorunumun ne olduğunu anladım. Her bir grid öğesinin sütun genişliği ile ayırt edilebilmesi gereken yüzdelerin kullanıldığını fark edemedim.

değiştirme:

.grid-sizer, 
    .grid-item { 
     width: 33.33%; 
    } 

.grid-sizer { 
    width: 16.667%; 
} 
.grid-item { 
    width: 33.33%; 
} 

benim sorunu çözdü.