2012-12-19 12 views
6

Ho creato una pagina della galleria. Visualizza immagini con altezze variabili. Come suggerito here to use a masonry plugin ho usato il plugin di muratura. Ha funzionato benissimo fino a ieri sera.Perché il mio sito ha perso l'allineamento del layout della griglia. È fatto con la muratura

Ma stamattina quando ho controllato di nuovo ho perso l'allineamento. Nessuna modifica apportata al sito dagli ultimi 3 giorni. Ecco l'istantanea. Check my site's screen shot here

precedenza, (I campi contrassegnati sono stati eliminati) tutti i div di sono regolati automaticamente e il display sembrava

http://pinterest.com/

Ma tutto ad un tratto il mio sito perso il suo allineamento. Incapace di capire il problema.

Quale potrebbe essere il problema .... Per favore aiutatemi. In un grosso problema con il mio sito

Ecco l'allineamento css e l'applicazione in muratura

#body {background-color:#1c4d5c;padding:10% 0% 20% 20%;} 
#imagesection 
{ 
margin:10px 10px 10px 10px; 
float:left; 
width:214px; 
border: 5px solid #f0f0f0; 
background-color:#d2dbde; 
border-radius:5px; 
} 

var $container = $('#body'); 

$container.imagesLoaded(function(){ 
    $container.masonry({ 
    itemSelector : '#imagesection' 
    }); 
}); 

Massoneria non funziona in IE 8 Masonry doesn't work in IE 8

Nota: io sto usando CodeIgniter, qui sto caricando i file header, body, footer etc in vista.

+2

Goblins, decisamente folletti ... ma in tutta onestà, come dovremmo sapere senza un esempio dal vivo, o un codice? – ChrisR

+1

È necessario fornire maggiori dettagli. Il nostro telepate locale è in vacanza. – Ranty

+0

Cosa si intende per Goblin ChrisR –

risposta

6

Tenta di utilizzare la classe necessaria solo dal plug-in muratura come .box .col2 ...

Altre classi potrebbero influenzare il vostro allineamento totale ..

+0

ho solo due div uno è #container e altro è #imagesection ho applicato solo per queste due div. Anche se ho usato tutte le classi di CSS come hai detto, questo non avrebbe funzionato prima! –

+2

@Rama raju dantuluri - Non riesco a indovinare esattamente da qui prova ad includere anche la classe .box e se hai bug di fuoco controlla la console per qualsiasi errore – Abhi

+0

Hey @abhi ho modificato la mia domanda con l'applicazione javascript css e muratura. Per favore guarda.Credo che qualche cambiamento nel plugin di muratura che sta causando questo problema. Perché tutto a un tratto perché questo problema ha sollevato? ho ragione ? –

2

Mi sembra che il contenitore circostante sia troppo grande. Regola nuovamente la larghezza su qualcosa di più piccolo. Puoi vedere sul bordo destro l'algoritmo di piastrellatura, quindi immagino che la muratura funzioni perfettamente.

+0

Per fare uno screenshot chiaro e farti sapere il problema riguardante il allineamento rimpicciolisce lo schermo e riprende lo schermo. In modo che miht essere la ragione per cui sembra avere un grande contenitore circostante. –

+0

Vuoi dire che hai un layout reattivo e quando si ingrandisce il problema persistono? La massoneria ha bisogno di un contenitore a larghezza fissa e non può funzionare con un layout reattivo. – Bytemain

+0

Il problema persiste anche con lo zoom predefinito. Voglio dire, per avere una visione completa del mio sito (come ora non posso fornirti il ​​link del sito scusa!) Ho preso uno screenshot mentre la finestra del browser è stata ingrandita. –

Problemi correlati