Szablon:ElastycznaKolumna2

 Dokumentacja szablonu [zobacz] [edytuj] [historia] [odśwież]

Użycie

Jest to szablon kontenera flex'owego kolumnowego, który może posiadać jako rodzic, aż dowolną liczbę dzieci div'owych. Jest on używany jako kontener elastyczny, w którym chcemy umieścić w jednej kolumnie n-dzieci rodzica flex'owego, jak za pomocą jego zwykłej wersji przy pomocy kontenera elastycznego flex kolumnowego pisanych za pomocą div'ów i stylów. Przy czym <div>...</div> dzieci pochodzą od poszczególnych elementów tego szablonu podane jako elementy numerowane.

Kod zastępczy dla {{ElastycznaKolumna2}} w postaci div'ów

• Przykład dla kodu pisanego za pomocą div'ów jako odpowiednik kontenera szablonowego {{ElastycznaKolumna2}}:

{{Div|styl=display:flex;flex-direction:column;height:100px;width:250px;|
    {{Div|styl=background:red;height:100%;width:150px;margin: 0 auto 0 auto;|Zawartość jeden.}}
    {{Div|styl=background:blue;height:50%;width:130px;margin: 0 0 0 auto;|Zawartość dwa.}}
    {{Div|styl=background:yellow;height:70%;width:130px;margin: 0 auto 0 0;|Zawartość trzy.}}
    {{Div|styl=background:gray;height:80%;width:250px;|Zawartość ostatnia.}}
 }}

• Kod powyższy w działaniu jest taki:

Zawartość jeden.

Zawartość dwa.

Zawartość trzy.

Zawartość ostatnia.

Przykład

{{ElastycznaKolumna2
   |1={{Div|styl=background:red;height:100%;width:150px;margin: 0 auto 0 auto;|Zawartość jeden.}}
   |2={{Div|styl=background:blue;height:50%;width:130px;margin: 0 0 0 auto;|Zawartość dwa.}}
   |3={{Div|styl=background:yellow;height:70%;width:130px;margin: 0 auto 0 0;|Zawartość trzy.}}
   |4={{Div|styl=background:gray;height:80%;width:250px;|Zawartość ostatnia.}}
   |styl=height:100px;width:250px;
 }}

• A powyższy kod w działaniu jest taki sam, co za pomocą div'ów, a więc:

Zawartość jeden.

Zawartość dwa.

Zawartość trzy.

Zawartość ostatnia.

Opis parametrów

Jest to opis szablonu kontenera flex'owego kolumnowego, który może posiadać jako rodzic, aż dowolną liczbę dzieci div'owych (od 1 do wzwyż) i parametr stylu div'a flexowego styl:

{{ElastycznaKolumna2
  |  1 = |  2 = |  3 = |... = Zawartość div'owa pierwszego, drugiego i wzwyż dalszych dzieci rodzica (opcjonalny, domyślnie równa wartości pustej)
  | styl = Styl rodzica (opcjonalny, domyślnie ustawiony na wartość pustą)
}}

Błędy

Błędy należy zgłaszać na stronie Wikibooks:Kwestie techniczne.

Parametry szablonu (strukturyzacja Wizualnego Edytora)

Szablon obsługujący flexbox'a szablonu {{ElastycznegoKolumna2}}, czyli jego elastyczne komórki są ułożone w pionie, przy czym jego komórki oparte o <div>...</div> pochodzą od dzieci tego obiektu wstawiane jako poszczególne numerowane elementy.

Parametry szablonu

Parametr		Opis	Typ	Status
1	1	Zwartość pierwszej komórki flexbox'a.	Ciąg znaków	wymagany
2	2	Zwartość drugiej komórki flexbox'a.	Ciąg znaków	opcjonalny
3	3	Zwartość trzeciej komórki flexbox'a.	Ciąg znaków	opcjonalny
4	4	Zwartość czwartej komórki Flexbox'a.	Ciąg znaków	opcjonalny
5	5	Zwartość piątej komórki flexbox'a.	Ciąg znaków	opcjonalny
6	6	Zwartość szóstej komórki flexbox'a.	Ciąg znaków	opcjonalny
7	7	Zwartość siódmej komórki flexbox'a.	Ciąg znaków	opcjonalny
8	8	Zwartość ósmej komórki flexbox'a.	Ciąg znaków	opcjonalny
9	9	Zwartość dziewiątej komórki flexbox'a.	Ciąg znaków	opcjonalny
10	10	Zwartość dziesiątej komórki Flexbox'a.	Ciąg znaków	opcjonalny
styl	styl	Styl pudełka całego flexbox'a.	Ciąg znaków	opcjonalny

Zobacz też

• {{ElastycznaKolumna}} - elastyczna kolumna zbudowana za pomocą flexbox'a, komórki są oparte o <div>...</div> i ułożone w pionie, zawartości elementów szablonu są do nich wsadzane.
• {{ElastycznaKolumna2}} - elastyczna kolumna zbudowana za pomocą flexbox'a, komórki są ułożone w pionie, zawartości elementów szablonu zawierają własne <div>...</div>, które są dodawane do niego.