Rangsor egységű szülő-helyzetében rögzítve

Egy ilyen hosszú időszak bevezetését először ma, meg kellett küzdenie annak szükségességét, hogy az oldalon, fix egység (a CSS-tulajdonság összesen: fix), ami a görgetés mindig ült ugyanazon a helyen a böngésző ablakot.

További információ erről a témáról, azt természetesen olvasni a különböző blogok és fórumok. De az összes döntést, hogy találkoztam, leírni egy kicsit, mire van szükségem. Leírják, hogyan kell rögzíteni a készülék tekintetében a szélén a böngésző ablakot, például a bal oldalsávon vagy a fejléc.

Velem volt egy kicsit más feladat. Van egy alapvető szülő blokk egy rögzített szélességű, egy vonalban a középső az ablak (margó: 0 auto). És mi van a megfelelő a blokk kerül egy fix egység, azaz a nem kell elhelyezni a szélén a böngésző ablakot, és a fő egységet. Itt van egy kész példa. amelynek én beszélek.

Az alábbiakban azt mondani, hogy én hajtotta végre, a következő jellemzők:

• az első helyen. abban a reményben, hogy valaki hasznos;
• másodszor. mint a kiságy maga a jövő (vagy írás utáni megerősítése érdekében az anyagot, ala „ismétlés - az anya a tanulás”, a tapasztalat azt mutatja, hogy az írás egy bejegyzést a döntés minden számomra ismeretlen, amíg ezt a feladatot nagyon jól emlékszem ez a döntés);
• Harmadik. abban a reményben, hogy valaki felajánlja egy elegáns megoldás.

Jelenleg a következő alapvető elrendezés:

Jelenleg az alábbi alapvető stílusok és tartalom blokkok:

Ie van egy fő tartályba szélessége 885px, központjában található az ablak, az alábbiakban 642px tartalmat, amelyet található a bal oldalon, és 243px jobbra a lefoglalt fix szélességű 240px egységet. Tulajdonképpen ez nem #wrapper azonosító.

Azt akarom, hogy összpontosítson #container ID paramétert. használt blokkot a fő tartalomra. Meg kell feltétlenül jelenti azt a szintet a réteg fölött (itt - z-index: 10), mint a réteg egy fix egység (ez feltételeknek megfelelően a példámat, más esetekben ezek a dolgok nem feltétlenül szükséges), különben lehetetlen lesz a FireFox'e szöveg kijelölése ebben blokkolja a része a magassága azonos a magassága a rögzített blokk.

Ahhoz, hogy megköti a visszatartott blokk a fő tartalmát, először megkérdezte megtartott blokk megfelelő pozicionálása (összesen: fix), stretching teljes szélességében a böngésző ablakot, majd tedd egy másik blokkot, amelyre ezeket alkalmazzák az abszolút pozícióját a fix szülői egység, azaz a .e. megkapta a következő:

Picking benyomódási tulajdonságok keresztül bal: 323px; blokkolni .fixed. képest középre a böngésző ablakot (margin: 0 auto;), átmentem a visszatartott blokk tervezett helyére érte.

Ennek eredményeként kaptam, amit akartam. Lásd a példákat csak a fent leírt.

Ez a példa jól működik a következő böngészők: Opera, Firefox, Safari, IE7, de nem működik a ...

Internet Explorer 6

Nos, mint nélküle. ) Self-Banner, dohányzó szoba sem tudja képzelni, hogy van egy pozíció értékét: fix. így ismét meg kell foltozni a lyukat a saját java script.

Ez az, amit megvan:

Elmagyarázom, milyen tulajdonságokat van szükség, bal: 50%; és a margin-left: -321px;. A tény az, hogy ha ugyanazt a bal margó, és hogy a többi böngésző, (balra: 323px;), a rögzített egység IE6 viselkedik helytelenül - a szűkülő böngésző ablakot, hogy eltolódik jobbra a fő egységet. Ezért, a bal: 50%; (Ez a tulajdonság fontos itt feltárt „véletlenszerűen”), valamint a következő kiegészítő negatív behúzás visszatérünk a neki szánt.

Minden. Most IE6 látjuk ugyanazt az eredményt, mint a többi böngésző.

Azonban, ha megnézi a példát a böngészőben, akkor veszi észre a következő leletek - ha lapozunk az oldalon egység csúnya rándulás. A probléma megoldásához ez a hiányosság, meg kell rendelni a tag test átlátszó háttérképet rögzített helymeghatározás, azaz mint ez:

Ami érdekes, hogy nem is szükséges, hogy pixel.gif képek a szerveren, csak ezt írni rángatózás megszűnt.

Sajnos, nem mindig lehet használni ezt a gyorsjavítás, mert a szervezet a háttér már elfoglalt eleme a honlap design. Akkor ez a bűn lesz IE6.

Ez minden, amit mondani akartam ezt a cikket.

Egy nagyszerű ajándék a születésnapi fiú - Lego játékok. amely egy nagy választék az online áruház «Lego mindenki számára.” Szállítás kerül sor mind magyarországi, mind a FÁK.