[CSS] float w pionie?


(Qrzysio) #1

Witam,

 

chciałbym zrobić na stronie taki układ obrazków jak na poniższym obrazku. Sęk w tym, że np. float:left ułoży mi obrazki w poziomie. Jak zrobić to samo, aby zachować kolejność tak, jak na obrazku i aby obrazki układały się jeden po drugim w pionowych rzędach po dwa?

 

Czy jedynym rozwiązaniem jest stworzenie kolumn? Mam nadzieję, że nie.

 

 

post-33350-0-03386500-1401138163_thumb.j


(YoJoe) #2

joomla hosting


(Qrzysio) #3

Dzięki za odpowiedź, poszukam odpowiedniego skryptu.


(sebkor96) #4

Ja bym spróbował stworzyć div'y w pionie i użyłbym w każdej z nich vertical-align a oddzielałbym je paddingiem albo borderem w kolorze tła. :wink:


#5

Ależ kombinujecie, toż to do zrobienia proste jak drut. Trzeba zrobić 4 identyczne div'y o zadanym width i height oraz dać float: left lub inline-table. Każdy div stanowi 25%szerokości. Ułożą sie w jednej linii. W każdym divie umieszczamy obrazki jako element blokowy i stylizujemy.


(Qrzysio) #6

 

 

Rozwiązanie na DIVach skutkuje tym, że przy wyciąganiu rekordów z bazy danych muszę obliczać do którego DIVa trafi każdy rekord i nadawać mu konkretny styl/pozycję. Gdyby zrobiło to JS sprawa byłaby o wiele łatwiejsza, także jeśli chodzi o kompatybilność przeglądarek.