Önterülő blokkok központú div (css, div html)

Önterülő blokkok központú div (css, div html)

Ebben a cikkben lesz szó, hogyan kell a div a közepén. Nagyon sok módja van, de nem minden teszik lehetővé kell tennie, hogy pontosan mire van szükség. Adok egy példát a legjobb és legegyszerűbb módja.

Általában több tucat módja, hogyan kell helyesen illessze a div blokk közepén, minden webmester használja a kedvenc \ a legkényelmesebb módon. Mindazonáltal van néhány alapvető, a legnépszerűbb és sokoldalú. És persze, az azonos kódok minden modern szabványoknak.

És igen, azt kell mondani egyszer, hogy ezek a módszerek nem működnek az IE6, vagy valami ilyesmi. Nem is figyelni ezt a böngészőt, annak ellenére, hogy hány ember használja. Itt az ideje, hogy elfelejt kezelhető használt cikkeket.

Szóval, mi van?

1. Eljárás legmeredekebb

Egy nagyon hatékony módszer, amely ráadásul azt is lehetővé teszi, hogy összehangolják a margó alul és felül. Mi a jellemző a módszer? Ez egyszerű az őrületbe. Van egy blokk egy bizonyos szélessége (pixelben vagy százalékban), amely az ingatlan «auto» kérés ugyanaz francia jobbra és balra, a végén kap egy div-blokk a központban. Az első érték (0 a példában) - egy teret alulról és felülről.

Például, hogy összehangolják a felső write:

Ahhoz, hogy összehangolja a felső és alsó:

Véleményem - ez a legjobb módja, hogy összehangolják blokkok a közepén. Emellett teljesen érvényes.

2. módszer Érdeklődjön

Ha az egység szélessége százalékban, tudjuk igazítani div középre alkalmazása egyenlő padding, hogy befejezze a teljes szélességében legfeljebb 100%. Aki nem érti, mutasd meg a példát, akkor könnyebb:

Van 50% -a szélessége a blokk, hogy összehangolják a központ, meg kell, hogy az oldalsó margók 25% a jobb és a bal ill. Élvezi a kódot:

Erőlködés nélkül, szerezni egy blokk a központban, bélelt triviális matematika (50 + 25 + 25) :)

3. módszer Vegyes

4. módszer használata a komplementer doboz

Sem a módszer nem oldja meg a problémát az úszó a blokkon belül, amikor a blokk szélessége természetesen nem ismert (például, menük).

Ebben az esetben azt használja extra egység obvorachivaet szintező blokk. Stílus, mint ez: