Zarovnání na střed: rozložení CSS. Vertikální zarovnání CSS pro každého

Myslím, že mnozí z vás, kteří se museli potýkat s rozložením, se setkali s potřebou zarovnat prvky vertikálně a znají potíže, které vznikají při zarovnání prvku na střed.

Ano, pro vertikální zarovnání existuje v CSS speciální vlastnost vertical-align s více hodnotami. V praxi to však vůbec nefunguje podle očekávání. Zkusme na to přijít.

Porovnejme následující přístupy. Zarovnat pomocí:

• stoly,
• odsazení,
• výška čáry
• protahování,
• záporná marže,
• transformovat
• pseudo prvek
• flexbox.

Pro ilustraci zvažte následující příklad.

Existují dva prvky div, přičemž jeden z nich je vnořen do druhého. Dejme jim odpovídající třídy – vnější a vnitřní.

Úkolem je zarovnat vnitřní prvek se středem vnějšího prvku.

Nejprve uvažujme případ, kdy jsou rozměry vnějších a vnitřních bloků známý. Přidejme zobrazení pravidla: inline-block k vnitřnímu prvku a text-align: center a vertical-align: middle k vnějšímu prvku.

Pamatujte, že zarovnání se vztahuje pouze na prvky, které mají režim zobrazení inline nebo inline-block.

Nastavíme velikosti bloků a také barvy pozadí, abychom viděli jejich okraje.

Vnější ( šířka: 200px; výška: 200px; text-align: center; vertical-align: middle; background-color: #ffc; ) .inner ( display: inline-block; width: 100px; height: 100px; background-color : #fcc)
Po použití stylů uvidíme, že vnitřní blok je zarovnán vodorovně, ale ne svisle:
http://jsfiddle.net/c1bgfffq/

Proč se to stalo? Jde o to, že vlastnost vertical-align ovlivňuje zarovnání prvek samotný, nikoli jeho obsah(kromě případů, kdy je aplikován na buňky tabulky). Použití této vlastnosti na vnější prvek tedy nic nevytvořilo. Navíc aplikace této vlastnosti na vnitřní prvek také nic neudělá, protože vložené bloky jsou zarovnány vertikálně vzhledem k sousedním blokům a v našem případě máme jeden vložený blok.

Existuje několik technik, jak tento problém vyřešit. Níže se na každý z nich podíváme blíže.

Zarovnání pomocí tabulky

První řešení, které mě napadá, je nahradit vnější blok tabulkou o jedné buňce. V tomto případě bude zarovnání aplikováno na obsah buňky, tedy na vnitřní blok.

http://jsfiddle.net/c1bgfffq/1/

Zjevnou nevýhodou tohoto řešení je, že ze sémantického hlediska je nesprávné používat k zarovnání tabulky. Druhou nevýhodou je, že vytvoření tabulky vyžaduje přidání dalšího prvku kolem vnějšího bloku.

První mínus lze částečně odstranit nahrazením tagů table a td div a nastavením režimu zobrazení tabulky v CSS.

.outer-wrapper ( display: table; ) .outer ( display: table-cell; )
Vnější blok však stále zůstane stolem se všemi z toho plynoucími důsledky.

Zarovnání pomocí odsazení

Pokud jsou známy výšky vnitřních a vnějších bloků, lze zarovnání nastavit pomocí svislých odsazení vnitřního bloku pomocí vzorce: (H vnější – H vnitřní) / 2.

Vnější ( výška: 200px; ) .vnitřní (výška: 100px; okraj: 50px 0; )
http://jsfiddle.net/c1bgfffq/6/

Nevýhodou řešení je, že je použitelné pouze v omezeném počtu případů, kdy jsou známé výšky obou bloků.

Zarovnání pomocí výšky čáry

Pokud víte, že vnitřní blok by neměl zabírat více než jeden řádek textu, můžete použít vlastnost line-height a nastavit ji na stejnou výšku vnějšího bloku. Vzhledem k tomu, že obsah vnitřního bloku by se neměl zalamovat do druhého řádku, doporučuje se přidat také pravidla white-space: nowrap a overflow: hidden.

Vnější ( výška: 200px; výška řádku: 200px; ) .vnitřní ( white-space: nowrap; overflow: hidden; )
http://jsfiddle.net/c1bgfffq/12/

Tuto techniku ​​lze také použít k zarovnání víceřádkového textu, pokud předefinujete hodnotu výšky řádku pro vnitřní blok a také přidáte pravidla zobrazení: inline-block a vertical-align: middle.

Outer ( height: 200px; line-height: 200px; ) .inner ( line-height: normal; display: inline-block; vertical-align: middle; )
http://jsfiddle.net/c1bgfffq/15/

Nevýhodou této metody je, že musí být známa výška vnějšího bloku.

Zarovnání pomocí "roztažení"

Tuto metodu lze použít, když je neznámá výška vnějšího bloku, ale je známa výška vnitřního bloku.

K tomu potřebujete:

1. nastavit relativní umístění k externímu bloku a absolutní umístění k vnitřnímu bloku;
2. přidejte pravidla top: 0 a bottom: 0 k vnitřnímu bloku, v důsledku čehož se roztáhne na celou výšku vnějšího bloku;
3. nastavte vertikální výplň vnitřního bloku na auto.

.vnější ( pozice: relativní; ) .vnitřní ( výška: 100px; pozice: absolutní; nahoře: 0; dole: 0; okraj: auto 0; )
http://jsfiddle.net/c1bgfffq/4/

Myšlenkou této techniky je, že nastavení výšky pro roztažený a absolutně umístěný blok způsobí, že prohlížeč vypočítá vertikální výplň ve stejném poměru, pokud je nastavena na auto.

Zarovnání se záporným okrajem-vrchol

Tato metoda se stala široce známou a používá se velmi často. Stejně jako předchozí se používá, když je neznámá výška vnějšího bloku, ale je známá výška vnitřního.

Musíte nastavit externí blok na relativní polohování a interní blok na absolutní polohování. Potom musíte posunout vnitřní blok dolů o polovinu výšky vnějšího horního okraje bloku: 50 % a zvednout ho o polovinu jeho vlastní výšky okraj-horní: -H vnitřní / 2.

Vnější ( pozice: relativní; ) .vnitřní ( výška: 100px; pozice: absolutní; nahoře: 50 %; margin-top: -50px; )
http://jsfiddle.net/c1bgfffq/13/

Nevýhodou této metody je, že musí být známa výška vnitřní jednotky.

Zarovnání s transformací

Tato metoda je podobná předchozí, ale lze ji použít, když výška vnitřní jednotky není známa. V tomto případě můžete místo nastavení záporného odsazení pixelů použít vlastnost transform a posunout vnitřní blok nahoru pomocí funkce translateY a hodnoty -50 % .

Vnější ( pozice: relativní; ) .vnitřní ( pozice: absolutní; nahoře: 50 %; transformace: přeložitY(-50 %); )
http://jsfiddle.net/c1bgfffq/9/

Proč nebylo možné nastavit hodnotu v procentech v předchozí metodě? Protože se hodnoty procentuálního okraje počítají vzhledem k rodičovskému prvku, hodnota 50 % by byla polovina výšky vnějšího rámečku a vnitřní rámeček bychom museli zvednout na polovinu jeho vlastní výšky. Vlastnost transform je pro to ideální.

Nevýhodou této metody je, že ji nelze použít, pokud má vnitřní jednotka absolutní polohování.

Zarovnání s Flexboxem

Nejmodernějším způsobem vertikálního zarovnání je použití flexibilního rozvržení boxu (populárně známého jako Flexbox). Tento modul umožňuje flexibilně ovládat umístění prvků na stránce a uspořádat je téměř kdekoli. Zarovnání na střed pro Flexbox je velmi jednoduchý úkol.

Vnější blok musí být nastaven na zobrazení: flex a vnitřní blok na margin: auto . A to je vše! Krásné, že?

Vnější ( displej: flex; šířka: 200px; výška: 200px; ) .vnitřní ( šířka: 100px; okraj: auto; )
http://jsfiddle.net/c1bgfffq/14/

Nevýhodou této metody je, že Flexbox podporují pouze moderní prohlížeče.

Jakou metodu mám zvolit?

Musíte začít od prohlášení o problému:

• Pro svislé zarovnání textu je lepší použít svislé odsazení nebo vlastnost line-height.
• Pro absolutně umístěné prvky se známou výškou (například ikony) je ideální metoda s negativní vlastností margin-top.
• Pro složitější případy, kdy výška bloku není známa, musíte použít pseudo prvek nebo vlastnost transform.
• No, pokud máte takové štěstí, že nepotřebujete podporovat starší verze prohlížeče IE, pak je samozřejmě lepší použít Flexbox.

Štítky: Přidat štítky

Vertikální centrování prvků pomocí CSS je úkol, který pro vývojáře představuje určité potíže. Existuje však několik metod, jak to vyřešit, které jsou docela jednoduché. Tato lekce představuje 6 možností pro vertikální centrování obsahu.

Začněme obecným popisem problému.

Problém vertikálního centrování

Horizontální centrování je velmi jednoduché a snadné. Když je vycentrovaný prvek vložený, použijeme vlastnost zarovnání vzhledem k rodičovskému prvku. Když je prvek na úrovni bloku, nastavíme jeho šířku a automatické nastavení levého a pravého okraje.

Většina lidí při použití vlastnosti text-align: odkazuje na vlastnost vertical-align pro vertikální centrování. Vše vypadá celkem logicky. Pokud jste používali šablony tabulek, pravděpodobně jste hojně využívali atribut valign, který posiluje přesvědčení, že vertikální zarovnání je ten správný způsob řešení problému.

Ale atribut valign funguje pouze na buňkách tabulky. A vlastnost vertical-align je jí velmi podobná. Ovlivňuje také buňky tabulky a některé vložené prvky.

Hodnota vlastnosti vertical-align je relativní k rodičovskému vloženému prvku.

• V řádku textu je zarovnání relativní k výšce řádku.
• Buňka tabulky používá zarovnání vzhledem k hodnotě vypočítané speciálním algoritmem (obvykle výška řádku).

Ale bohužel vlastnost vertical-align nefunguje na prvcích na úrovni bloku (například odstavce uvnitř prvku div). Tato situace může vést k domněnce, že problém vertikálního vyrovnání neexistuje.

Existují však i jiné způsoby centrování blokových prvků, jejichž výběr závisí na tom, co se centruje vzhledem k vnější nádobě.

Metoda výšky čáry

Tato metoda funguje, když chcete svisle vycentrovat jeden řádek textu. Jediné, co musíte udělat, je nastavit výšku řádku tak, aby byla větší než velikost písma.

Ve výchozím nastavení bude bílé místo rovnoměrně rozmístěno v horní a dolní části textu. A čára bude svisle vycentrována. Často se výška čáry rovná výšce prvku.

HTML:

CSS:

#child ( výška řádku: 200px; )

Tato metoda funguje ve všech prohlížečích, i když ji lze použít pouze pro jeden řádek. Hodnota 200 px v příkladu byla zvolena libovolně. Můžete použít libovolnou hodnotu větší, než je velikost písma textu.

Centrování obrázku pomocí Line-Height

Co když je obsahem obrázek? Bude výše uvedená metoda fungovat? Odpověď spočívá v dalším řádku kódu CSS.

HTML:

CSS:

#parent ( line-height: 200px; ) #parent img ( vertical-align: middle; )

Hodnota vlastnosti line-height musí být větší než výška obrázku.

Metoda tabulky CSS

Výše bylo zmíněno, že vlastnost vertical-align se používá pro buňky tabulky, kde funguje skvěle. Náš prvek můžeme zobrazit jako buňku tabulky a použít na ní vlastnost vertical-align k vertikálnímu vystředění obsahu.

Poznámka: CSS tabulka není to samé jako HTML tabulka.

HTML:

CSS:

#parent (display: table;) #child ( display: table-cell; vertical-align: middle; )

Nastavíme výstup tabulky na nadřazený prvek div a vyvedeme vnořený prvek div jako buňku tabulky. Nyní můžete použít vlastnost vertical-align na vnitřním kontejneru. Vše v něm bude vertikálně vycentrováno.

Na rozdíl od výše uvedené metody může být v tomto případě obsah dynamický, protože prvek div změní velikost podle svého obsahu.

Nevýhodou této metody je, že nefunguje ve starších verzích IE. Pro vnořený kontejner musíte použít vlastnost display: inline-block.

Absolutní umístění a záporné okraje

Tato metoda funguje také ve všech prohlížečích. Vyžaduje to však, aby centrovanému prvku byla dána výška.

Ukázkový kód provádí horizontální a vertikální centrování současně:

HTML:

CSS:

#rodič (pozice: relativní;) #dítě ( pozice: absolutní; nahoře: 50 %; vlevo: 50 %; výška: 30 %; šířka: 50 %; okraj: -15 % 0 0 -25 %; )

Nejprve nastavíme typ umístění prvku. Dále nastavíme vlastnosti top a left vnořeného prvku div na 50 %, což odpovídá středu nadřazeného prvku. Ale střed je levý horní roh vnořeného prvku. Proto jej musíte zvednout (polovina výšky) a posunout doleva (polovina šířky), a pak se střed bude shodovat se středem nadřazeného prvku. Znalost výšky prvku je tedy v tomto případě nezbytná. Potom nastavíme prvek se záporným horním a levým okrajem rovným polovině výšky a šířky.

Tato metoda nefunguje ve všech prohlížečích.

Absolutní polohování a protahování

Příklad kódu provádí vertikální a horizontální centrování.

HTML:

CSS:

#rodič (pozice: relativní;) #dítě ( pozice: absolutní; nahoře: 0; dole: 0; vlevo: 0; vpravo: 0; šířka: 50 %; výška: 30 %; okraj: auto; )

Myšlenkou této metody je roztáhnout vnořený prvek na všechny 4 okraje nadřazeného prvku nastavením vlastností top, bottom, right a left na 0.

Nastavením okraje na automatické generování na všech stranách se nastaví stejné hodnoty na všech 4 stranách a náš vnořený prvek div se vycentruje na jeho nadřazený prvek.

Bohužel tato metoda nefunguje v IE7 a nižších.

Stejné prostory nad a pod

V této metodě je rovná výplň explicitně nastavena v horní a dolní části nadřazeného prvku.

HTML:

CSS:

#rodič (výplň: 5 % 0; ) #dítě (výplň: 10 % 0; )

Ukázkový kód CSS nastavuje horní a dolní odsazení pro oba prvky. U vnořeného prvku bude nastavení výplně sloužit k jeho vertikálnímu vystředění. A výplň nadřazeného prvku vycentruje vnořený prvek v něm.

K dynamické změně velikosti prvků se používají relativní jednotky měření. A pro absolutní jednotky měření budete muset provést výpočty.

Pokud má například nadřazený prvek výšku 400 pixelů a vnořený prvek má velikost 100 pixelů, je potřeba 150 pixelů odsazení nahoře a dole.

150 + 150 + 100 = 400

Použití % umožňuje ponechat výpočty na prohlížeči.

Tato metoda funguje všude. Nevýhodou je nutnost výpočtů.

Poznámka: Tato metoda funguje tak, že se nastavuje vnější výplň prvku. Můžete také použít okraje v rámci prvku. Rozhodnutí použít okraje nebo vycpávky musí být učiněno v závislosti na specifikách projektu.

plovoucí div

Tato metoda používá prázdný prvek div, který se vznáší a pomáhá řídit pozici našeho vnořeného prvku v dokumentu. Všimněte si, že plovoucí prvek div je v kódu HTML umístěn před naším vnořeným prvkem.

HTML:

CSS:

#parent (výška: 250px;) #floater (plovoucí: vlevo; výška: 50%; šířka: 100%; margin-bottom: -50px; ) #child (clear: both; height: 100px; )

Prázdný prvek div odsadíme doleva nebo doprava a nastavíme jeho výšku na 50 % nadřazeného prvku. Tímto způsobem vyplní horní polovinu nadřazeného prvku.

Protože je tento prvek div plovoucí, je odstraněn z normálního toku dokumentu a musíme rozbalit text na vnořeném prvku. V příkladu je použito clear: both , ale zcela stačí použít stejný směr jako offset plovoucího prázdného prvku div.

Horní okraj vnořeného prvku div je přímo pod spodním okrajem prázdného prvku div. Potřebujeme posunout vnořený prvek nahoru o polovinu výšky plovoucího prázdného prvku. Chcete-li problém vyřešit, použijte zápornou hodnotu vlastnosti margin-bottom pro plovoucí prázdný prvek div.

Tato metoda funguje také ve všech prohlížečích. Jeho použití však vyžaduje další prázdný prvek div a znalost výšky vnořeného prvku.

Závěr

Všechny popsané metody jsou snadno použitelné. Potíž je v tom, že žádný z nich není vhodný pro všechny případy. Musíte analyzovat projekt a vybrat ten, který nejlépe vyhovuje požadavkům.

Cílem dnešního článku je ukázat vám, jak vycentrovat div, horizontálně i vertikálně, pomocí několika CSS triků. Také vám řekneme, jak vycentrovat přes celou stránku nebo v jednotlivém prvku div.

Jednoduše vycentrujte prvek DIV na stránce

Tato metoda bude fungovat perfektně ve všech prohlížečích.

CSS

Center-div ( okraj: 0 auto; šířka: 100px; )

Příklad

Hodnota auto ve vlastnosti margin nastavuje levý a pravý okraj na celý dostupný prostor na stránce. Zde je důležité si zapamatovat, že vycentrovaný prvek div musí mít nastavenou hodnotu šířky.

Centrování DIV uvnitř prvku DIV starým způsobem

Tato metoda div zarovnání na střed bude fungovat ve všech prohlížečích.

CSS

Outer-div ( padding: 30px; ) .inner-div ( margin: 0 auto; width: 100px; )

HTML

Příklad

Vnější div lze umístit kamkoli, ale vnitřní div musí mít určenou šířku ( šířka).

Centrování DIV uvnitř prvku DIV pomocí inline-block

Při této metodě centrování prvku div v rámci prvku div není nutné specifikovat šířku vnitřního prvku. Bude fungovat ve všech moderních prohlížečích, včetně IE8.

CSS

Outer-div ( padding: 30px; text-align: center; ) .inner-div ( display: inline-block; padding: 50px; )

HTML

Příklad

Vlastnost text-align funguje pouze u vložených prvků. Hodnota inline-block umožňuje zobrazit vnitřní prvek div jako vložený prvek a také jako blok ( inline-blok). Vlastnost text-align na vnějším prvku div nám umožní vycentrovat vnitřní prvek div.

Vycentrujte DIV uvnitř prvku DIV vodorovně a svisle

Here margin: auto se používá k vystředění prvku div na střed stránky. Příklad bude fungovat ve všech moderních prohlížečích.

CSS

Outer-div ( padding: 30px; ) .inner-div ( margin: auto; width: 100px; height: 100px; )

HTML

Příklad

Vnitřní prvek div musí mít zadanou šířku ( šířka) a výška ( výška). Tato metoda nebude fungovat, pokud má vnější prvek div pevnou výšku.

Vycentrujte DIV v dolní části stránky

Zde margin: auto se používá pro vertikální vystředění divu a absolutní umístění se používá pro vnější prvek. Metoda bude fungovat ve všech moderních prohlížečích.

CSS

Outer-div ( pozice: absolutní; dolní: 30px; šířka: 100 %; ) .inner-div ( margin: 0 auto; šířka: 100px; výška: 100px; barva pozadí: #ccc; )

HTML

Příklad

Vnitřní div musí mít nastavenou šířku. Prostor v dolní části stránky je upraven pomocí vlastnosti bottom vnějšího div. Div můžete také vycentrovat v horní části stránky tak, že nahradíte vlastnost bottom vlastností top.

Vycentrujte prvky DIV na stránce svisle a vodorovně

Zde pro vystředění divu opět použijeme margin: auto a absolutní umístění vnějšího divu. Metoda bude fungovat ve všech moderních prohlížečích.

CSS

Center-div ( pozice: absolutní; okraj: auto; nahoře: 0; vpravo: 0; dole: 0; vlevo: 0; šířka: 100px; výška: 100px; )

Příklad

Element div musí mít nastavenou šířku ( šířka) a výška ( výška).

Provedení adaptivního centrování prvku DIV na stránce

Zde, abychom vycentrovali div pomocí CSS, přizpůsobíme šířku prvku div tak, aby reagovala na změny velikosti okna. Tato metoda funguje ve všech prohlížečích.

CSS

Center-div ( margin: 0 auto; max-width: 700px; )

Příklad

Vycentrovaný prvek div musí mít nastavenou vlastnost max-width.

Centrování DIV uvnitř prvku pomocí vlastností vnitřního bloku

Vnitřní prvek div je zde citlivý. Tato metoda centrování prvku div uvnitř prvku div bude fungovat ve všech prohlížečích.

CSS

Outer-div ( padding: 30px; ) .inner-div ( margin: 0 auto; max-width: 700px; )

HTML

Příklad

Vnitřní div musí mít nastavenou vlastnost max-width.

Centrování dvou citlivých divů vedle sebe

Zde máme vedle sebe dva responzivní prvky div. Tento způsob umístění prvku div do středu obrazovky bude fungovat ve všech moderních prohlížečích.

CSS

Container ( text-align: center; ) .left-div ( display: inline-block; max-width: 300px; vertical-align: top; ) .right-div ( display: inline-block; max-width: 150px; ) obrazovka a (max. šířka: 600 pixelů) ( .left-div, .right-div (lef max-width: 100 %; ) )

HTML

Příklad

Zde máme několik prvků s aplikovanou vlastností inline-block umístěných uvnitř vycentrovaného kontejneru. Tento příklad také používá dotazy na média CSS; to znamená, že pokud je velikost obrazovky menší než 600 pixelů, pak je vlastnost max-width pro levý i pravý div nastavena na 100 %.

Element DIV vycentrovaný pomocí Flexboxu

Zde vycentrujeme CSS div pomocí Flexboxu. Je určen k usnadnění procesu vývoje návrhů uživatelského rozhraní. Tento modul podporují Chrome 38+, IE11, Microsoft Edge, Firefox 38+, Safari 9+, Opera 30+, iOS Safari 9+ a také prohlížeč Android 40+.

CSS

Kontejner ( display: flex; align-items: center; justify-content: center; height: 100vh; ) .item ( background-color: #f3f2ef; border-radius: 3px; width: 200px; height: 100px; )

Ahoj! Pokračujeme v zvládnutí základů jazyka HTML. Podívejme se, co musíte napsat, abyste zarovnali text na střed, šířku nebo okraje.

Když se pustíme do práce, podívejme se, jak vycentrovat text v HTML třemi různými způsoby. Poslední dva jsou propojeny přímo se šablonou stylů. Může to být soubor CSS, který se připojuje ke stránkám webu a definuje jejich vzhled.

Metoda 1 - přímá práce s HTML

Je to vlastně docela jednoduché. Viz příklad níže.

Zarovnejte odstavec na střed.

Pokud potřebujete přesunout fragmenty textu jiným způsobem, zadejte místo parametru „centrum“ následující hodnoty:

• zarovnat – zarovná text na šířku stránky;
• vpravo – na pravém okraji;
• doleva - doleva.

Analogicky můžete přesunout obsah, který je v záhlaví (h1, h2) a kontejneru (div).

Metoda 2 a 3 - pomocí stylů

Výše uvedený design lze mírně změnit. Efekt bude stejný. Chcete-li to provést, musíte napsat níže uvedený kód.

Textový blok.

V této podobě je kód zapsán přímo do HTML, aby se textový obsah vycentroval.

Existuje další alternativní způsob, jak dosáhnout výsledků. Budete muset provést několik kroků.

Krok 1. Do hlavního kódu napište

Textový materiál.

Krok 2. Do přiloženého souboru CSS zadejte následující kód:

Rovno (text-align:center;)

Podotýkám, že slovo „rovno“ je jen název třídy, kterou lze nazvat jinak. To je ponecháno na uvážení programátora.

Analogicky v HTML můžete snadno zarovnat text na střed, zarovnat a zarovnat k pravému nebo levému okraji stránky. Jak vidíte, existuje daleko více možností, jak dosáhnout svého cíle.

Jen pár otázek:

• Děláte informační neziskový projekt?
• Chcete, aby se vaše webové stránky dobře umisťovaly ve vyhledávačích?
• Chcete si vydělávat online?

Pokud jsou všechny odpovědi kladné, podívejte se na integrovaný přístup k vývoji webových stránek. Informace budou užitečné zejména v případě, že běží na WordPress CMS.

Upozorňuji, že vlastní webové stránky jsou jen jednou z mnoha možností, jak generovat pasivní či aktivní příjem na internetu. Můj blog je věnován finančním příležitostem online.

Pracovali jste někdy v oblasti dopravní arbitráže, copywritingu a dalších oblastech činnosti, které generují primární nebo doplňkový příjem prostřednictvím spolupráce na dálku? To a mnohem více se můžete dozvědět právě teď na stránkách mého blogu.

V budoucnu zveřejním spoustu opravdu užitečných informací. Zůstaňte ve spojení. Pokud si přejete, můžete se přihlásit k odběru aktualizací Workip e-mailem. Formulář předplatného je umístěn níže.

Weboví designéři používají DIV při své práci každý den. Bez jakéhokoli podceňování je to nejoblíbenější značka. Otevřete zdrojový kód libovolné webové stránky a uvidíte, že většina, ne-li dvě třetiny objektů, je uzavřena