Dynamiczna zmiana kolumn

[Pawliniak]

Witam wykaz podkategorii w trzech kolumnach jednak po zwężeniu strony nie wygląda to zbyt atrakcyjnie.

Dokładnie chodzi o to http://forum.invisionize.pl/topic/8854-subfora-w-trzech-kolumnach/

 

Czy można to jakoś przerobić zeby zamieniało się z 3 na 1 kolumnę?

 

Pozdrawiam

[DawPi]

Tam jest zastosowany prosty kod HTML/CSS. Ty szukasz już grubszej sprawy związanej z JS i rozpoznawaniem szerokości 'w locie'.

[Pawliniak]

Da się coś takiego?

 

<div class="ukryj jak będzie większe niż 980px" />kod na jedną kolumnę</div>

 

<div class="pokaż jak będzie większe niż 980px" />kod na trzy kolumny</div>

 

Takie dwa divy pokazujące się zależnie od szerokości

Edytowane 6 Stycznia 2014 przez Pawliniak

[DawPi]

No właśnie o tym mówię - trzeba by napisać kod JS, a w tym niestety, ale jeszcze nadal nie czuję się mocny. Może jakiegoś gotowca znajdziesz w necie.

[Pawliniak]

Poradziłem sobie tak!

 

@media screen and (min-width: 1730px) {

table.ipb_table ol.subforums {

margin-top: 3px;                

float: left;                 

width: 33%;

}

 

table.ipb_table ol.subforums1 {                 

width: 33%;                  

}

 

table.ipb_table ol.subforums2 {                 

width: 33%;                  

}

}

 

@media screen and (max-width: 1730px) {

table.ipb_table ol.subforums {

margin-top: 3px;                

float: left;                 

width: 50%;

}

 

table.ipb_table ol.subforums1 {                 

width: 50%;                  

}

 

}

 

@media screen and (max-width: 1380px) { 

table.ipb_table ol.subforums {

margin-top: 3px;                

float: left;                 

width: 100%;

}

 

}