Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Div na divie bez zagnieżdżania diva w divie - Problem z z-index
Forum PHP.pl > Forum > Po stronie przeglądarki > CSS
malkavi
Witam, męczę się już 2 dni z właściwością css "z-index", niestety nie wiem co robię źle..

To co chcę osiągnąć to wyciągnięcie czerwonego boxa wraz z treścią na tło z obrazkiem (domyślnie czarne)

Wiem że można to rozwiązać poprzez zagnieżdżenie diva w divie, lecz niestety mój cms generuje kod w takiej postaci czyli div tła obok diva boxu.

W tej chwili czerwony box znajduje się pod tłem.

KLIKNIJ ABY ZOBACZYĆ KOD

Bardzo proszę o pomoc.
Damonsson
na przykład:

  1. top: -600px;


dla .box

malkavi
Zrobiłem tak i box faktycznie podniósł się ale niestety w miejscu gdzie był wcześniej został po nim wielki biały obszar w który nie da się nic normalnie wstawić. Jak to zrobić inaczej ?
Damonsson
to dla .box
  1. top: 0px;
  2. position: absolute;



Ewentualnie tak jak było i dla elementu który ma być tam w tym miejscu
  1. margin-top: -600px;
malkavi
Kod
position: absolute;

Odpada, ponieważ wtedy tracę wszystkie właściwości centrowania i dostosowywania się do szerokości przeglądarki, divu .box
------------

Kod
margin-top: -600px;

to znów działa w taki sposób że przenosi ten duży biały obszar po boxie na sam dół strony pod stopkę i nadal się go nie pozbywam.

------------------

Da się to jakoś zrobić posiłkując się właściwościami "z-index" ?
Damonsson
z-index nie ma z tym nic wspólnego. Jeśli chcesz umieścić jakiś element w innym, a nie jest jego potomkiem, to musisz użyć position: absolute/relative/fixed.

To może dla .box

  1. margin-top: -720px;


http://jsbin.com/onIReyEK/8/edit
malkavi
Bardzo ci dziękuję! o to właśnie mi chodziło.

Szkoda że logicznie nie potrafię tego ogarnąć. Jak to jest że ustawiam margin na wartość minusową którego nie ma ?

Polecił byś może jakiś artykuł w którym jest to dobrze wytłumaczone jak działają te minusowe wartości parametrów ?
Damonsson
Teraz masz domyślnie, margin-top: 0px. Jak dasz -720px no to będzie miało ujemny margines, a jako, że jest position: absolute/relative/fixed to najdzie na element wyżej. Hmm z kursów to browsehappy czy jakoś tak polecam, fajnie wizualnie wytłumaczone wszystko. Ale czy akurat to, to nie wiem.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.