Forum PHP.pl

Stworzyłem menu galerii, które zawiera w sobie kolejno dwa DIVy:

[HTML] pobierz, plaintext 
<div id="1">
  <div id="2">
    Zawartość
   </div>
</div>
[HTML] pobierz, plaintext 

DIV #1 ma overflow: hidden, więc DIV #2 i zawartość pięknie mieszczą się w jego granicach. Do tej pory kod działał. Jednak zmodyfikowałem DIVa #1 tak, że ma cień wewnętrzny. Zatem, żeby zawartość nie zasłaniała cieni, wprowadziłem dodatkowy, nieco mniejszy DIV pomiędzy #1, a #2 i to w nim wprowadziłem overflow: hidden. Teraz kod wygląda tak:

[HTML] pobierz, plaintext 
<div id="1">
  <div id="dodatkowy">
  <div id="2">
    Zawartość
  </div>
  </div>
</div>
[HTML] pobierz, plaintext 

Jednak tym razem już overflow nie działa. Zawartość z DIVa #2 wylewa się na dół.

Rzeczywista strona jest tutaj: http://mateuszgawlinski.pl/css3/galeria.php?galeria=rodzina
DIVy nazywają się odpowiednio #menu, #menu2 i #menu_inner.
Przedstawiłem problem na przykładzie, bo mój kod na stronie jest niechlujny i nie wiem, czy byście się połapali.

W własnie, że DIV #2. Dlaczego? Sprawdź kod, jasno widać.

Posługując się już nazwami z rzeczywistej strony powiem, że overflow: hidden ma DIV o nazwie "menu2" czyli ten, który jest środkowy. I tak chyba powinno być prawda?

Ten post edytował matewka 13.12.2010, 14:22:07

Jak dałem do #menu to działało.
Ale BTW
CSS do zmiany (tylko istotne reguły)

[CSS] pobierz, plaintext 
#menu2
{
display: block;
position: relative;
overflow:hidden;
}
 
#menu_inner 
{
display: block;
}
[CSS] pobierz, plaintext 

Tak, jak mówisz - owszem działa - ale zwróć uwagę, że obrazki zakrywają u góry i na dole cień tego diva zewnętrznego. Właśnie dlatego wprowadziłem div #menu2, żeby tego uniknąć.

Co do bałaganu w kodzie, to wiem, że jest to wszystko do posprzątania. Zacząłem kombinować z modelem pudełkowym z css3 i narobiło się tego...

To, że zakrywają to już tylko kwestia wyliczenia pozycji

[CSS] pobierz, plaintext 
#menu_inner
{
left: 0;
}
 
img.miniaturka
{
margin: 10px 0;
}
[CSS] pobierz, plaintext 

Nie pomogło

Już wiem o co biega.
Miałem:

[HTML] pobierz, plaintext 
#menu2 {
position: absolute: <!-- średnik, a nie dwukropek! -->
}
[HTML] pobierz, plaintext 

Co za babol!

Dzięki za zaangażowanie i pomoc.

Ten post edytował matewka 15.12.2010, 19:12:07