Šablon:Flex columns/dok

Ovaj šablon kreira izgled kolone, gde će sadržaj unutar kolona imati istu visinu, sa svim dodatnim razmacima raspoređenim kroz sadržaj kraćih kolona. Uglavnom je namenjen za upotrebu u portalima.

Ova vrsta rasporeda zahteva da web-preglednici podržavaju CSS fleksibilni raspored kutije (flexbox). Za one koji to ne čine, postoji rezervna opcija koja će prikazati prikaz u dve kolone, ali bez iste visine (izgled koji su mnogi portali koristili u julu 2018.).

Za uske ekrane, npr. mobilnih uređaja, ekran se vraća u jednu kolonu.

Upotreba

{{Flex columns
|1 = (...sadržaj prve kolone...)
|2 = (...sadržaj druge kolone...)
}}

Samo sadržaji koji su u oznakama <div>...</div> će imati dodatni razmak raspoređen na njih – osim onih sa klasom flex-columns-noflex (ili na drugi način zameniti flex: kod> svojstvo)

Da biste promenili stanje kolone, mogu se podesiti |flex1= i/ili |flex2=. Podrazumevano za svaki je 1. Na primer:

• <noviki>|flex1=3 |flex2=2</noviki> će dovesti do toga da prva kolona zauzima do 60% (3/5) dostupne širine, a druga kolona zauzima najmanje 40% (2/5) širine. Imajte na umu da će stvarni balans kolone varirati u zavisnosti od veličine ekrana, pošto je minimalna širina svake kolone postavljena na 360 piksela.

Primeri

{{Flex columns
|1 =
{{Box-header
| title= Izabrani članak
| EDITLINK= no 
| text-align= left
| titleforeground= white
| titlebackground= #4e7d4d
| margin=
| border-radius= 0 0 10px 10px
| title-border-radius= 10px 10px 0 0
| title-font-family= Trebuchet MS
| title-font-size= 120%
| title-font-weight= bold
| title-align= center
| color= #FFFFFF
| padding= 0.05em 0.4em
}}
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras enim nibh, hendrerit vitae consectetur ut, eleifend at dui. Sed tempor, ex et commodo auctor, dui justo dapibus tellus, at dapibus felis dui sed odio. Aenean semper luctus tellus, et molestie est mollis in. Etiam tempus condimentum felis sed luctus. Cras lobortis lacinia urna, in interdum nisl pulvinar non. Nulla non nibh ut massa tempor sagittis quis eu magna. Donec et arcu in tortor commodo blandit ut mattis justo. Maecenas sed facilisis magna, quis suscipit ipsum. Cras sed lacus eu erat blandit scelerisque.

Sed rhoncus vestibulum nulla, et scelerisque libero cursus aliquet. Curabitur a efficitur massa. Quisque quis laoreet erat, et rutrum risus. Cras porta purus faucibus, mattis lorem efficitur, rutrum nisl. Nunc facilisis nulla ut posuere tincidunt. Suspendisse commodo, sapien nec eleifend vulputate, risus elit feugiat lacus, vitae interdum ante massa nec elit. Nullam ex risus, malesuada vel tellus a, ornare mollis lorem. Aliquam erat volutpat. Vivamus mattis nibh odio, tincidunt iaculis elit bibendum ut.

Sed ante sem, convallis ac viverra at, scelerisque ac enim. Mauris viverra erat dignissim ipsum pretium, ac eleifend eros egestas. Quisque cursus lectus mattis, maximus ex vel, sollicitudin felis. Praesent at mauris eu risus imperdiet.
{{Box-footer| [[Lorem ipsum|čitaj dalje...]] }}

|2 =
{{Box-header
| title= Izabrana fotografija
| EDITLINK= no 
| text-align= center
| titleforeground= white
| titlebackground= #4e7d4d
| border-radius= 0 0 10px 10px
| title-border-radius= 10px 10px 0 0
| title-font-family= Trebuchet MS
| title-font-size= 120%
| title-font-weight= bold
| title-align= center
| color= #FFFFFF
| padding= 0.05em 0.4em
}}
[[Datoteka:Example image not to be used in article namespace.jpg|center|275px]]
Opis slike
{{Box-footer}}
}}

Izabrani članak

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras enim nibh, hendrerit vitae consectetur ut, eleifend at dui. Sed tempor, ex et commodo auctor, dui justo dapibus tellus, at dapibus felis dui sed odio. Aenean semper luctus tellus, et molestie est mollis in. Etiam tempus condimentum felis sed luctus. Cras lobortis lacinia urna, in interdum nisl pulvinar non. Nulla non nibh ut massa tempor sagittis quis eu magna. Donec et arcu in tortor commodo blandit ut mattis justo. Maecenas sed facilisis magna, quis suscipit ipsum. Cras sed lacus eu erat blandit scelerisque.

Sed rhoncus vestibulum nulla, et scelerisque libero cursus aliquet. Curabitur a efficitur massa. Quisque quis laoreet erat, et rutrum risus. Cras porta purus faucibus, mattis lorem efficitur, rutrum nisl. Nunc facilisis nulla ut posuere tincidunt. Suspendisse commodo, sapien nec eleifend vulputate, risus elit feugiat lacus, vitae interdum ante massa nec elit. Nullam ex risus, malesuada vel tellus a, ornare mollis lorem. Aliquam erat volutpat. Vivamus mattis nibh odio, tincidunt iaculis elit bibendum ut.

Sed ante sem, convallis ac viverra at, scelerisque ac enim. Mauris viverra erat dignissim ipsum pretium, ac eleifend eros egestas. Quisque cursus lectus mattis, maximus ex vel, sollicitudin felis. Praesent at mauris eu risus imperdiet.

Izabrana fotografija

Opis slike