Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [HTML] Relacje miedzy DIVami
BugsBunny
post
Post #1





Grupa: Zarejestrowani
Postów: 206
Pomógł: 4
Dołączył: 2.04.2005

Ostrzeżenie: (0%)
-----


Zdjęcie obrazujące zokład strony :
(IMG:http://img390.imageshack.us/img390/2737/divyng8.jpg)

Mam problem z Divami. Mianowice standardowy szablon strony Menu (różowe), Główna cześć (zielona) i stopka(niebieska).
Menu i główna cześć są w kolejnym Divie (szary)

a więc tak:
menu ma w stylach ustawione position relative i jeżeli menu sie powiększy to stopka zjedzie w dół tak jak powinna.

Niestety dla cześci głównej position relative sprawia, że zaczyna ono się dopiero na wysokości zakończenia menu, więc dałem absolute i wypozycionowałem je na równo z menu. Powoduje to jednak, brak przesuwania stopki po zwiekszeniu wysokosci glownej cześci (dodajac do niej zawartość).

Jak mogę sobie z tym poradzić??
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi (1 - 7)
mike
post
Post #2





Grupa: Przyjaciele php.pl
Postów: 7 494
Pomógł: 302
Dołączył: 31.03.2004

Ostrzeżenie: (0%)
-----


Idź w tym kierunku:
Kod
#menu { float: left; }
#content { float: right; }
Go to the top of the page
+Quote Post
BugsBunny
post
Post #3





Grupa: Zarejestrowani
Postów: 206
Pomógł: 4
Dołączył: 2.04.2005

Ostrzeżenie: (0%)
-----


zaczęło działać dla relative tylko, że teraz stopka zamiast zacząć się na końcu menu albo głownej cześci jest na górze
Go to the top of the page
+Quote Post
mike
post
Post #4





Grupa: Przyjaciele php.pl
Postów: 7 494
Pomógł: 302
Dołączył: 31.03.2004

Ostrzeżenie: (0%)
-----


To daj dla bloku, który obejmuje #menu i #content właściwość overflow: auto;
Go to the top of the page
+Quote Post
BugsBunny
post
Post #5





Grupa: Zarejestrowani
Postów: 206
Pomógł: 4
Dołączył: 2.04.2005

Ostrzeżenie: (0%)
-----


Niestety ale nic to nie zmieniło
  1. .LeftMenu
  2. {
  3. overflow: auto;
  4. width:201px;
  5. float: left;
  6. background-image: url('images/leftMenu.jpg');
  7. position: relative;
  8. top:0px;
  9. background-repeat: repeat-y;
  10. }
  11.  
  12. .main
  13. {
  14.  
  15. background-image: url('images/main.jpg');
  16. width:791px;
  17. float: right;
  18. overflow: auto;
  19. position: relative;
  20. background-repeat: repeat-y;
  21. top: 0px;
  22. min-height: 100px;
  23. }
  24.  
  25. .Middle
  26. {
  27. position:absolute;
  28. top:560px;
  29. width:1000px;
  30. background-color: gray;
  31.  
  32. }


Może ten Middle coś mąci. To jest ten Div, w którym jest zapakowane menu i głowna część
Go to the top of the page
+Quote Post
hiszpanespaniol
post
Post #6





Grupa: Zarejestrowani
Postów: 213
Pomógł: 39
Dołączył: 7.04.2008
Skąd: 3city

Ostrzeżenie: (0%)
-----


jeżeli masz gdzieś position: absolute, to wtedy ten element nie zajmuje w ogóle miejsca i inne się nim nie przejmują zajmując miejsce. pousuwaj to position absolute, na pewno nie jest potrzebne. dobrą radę dostałeś żeby float'ować.

jak po menu i treści dasz stopkę (jeszcze wewnątrz szarego div'a) i napiszesz, że ma być clear: both, to juz wtedy będzie git. bo divy floatowane też nie mają wysokości. EWENTUALNIE jeśli nie chcesz ruszać stopki to po menu i treści daj pustego div'a z clear: both.
Go to the top of the page
+Quote Post
Pilsener
post
Post #7





Grupa: Zarejestrowani
Postów: 1 590
Pomógł: 185
Dołączył: 19.04.2006
Skąd: Gdańsk

Ostrzeżenie: (0%)
-----


Cytat
Menu i główna cześć są w kolejnym Divie (szary)
- po co? Wykorzystaj body i html, dla nich też możesz nadawać tło, ustawiać marginesy itp.

Daj:
1. Dla menu float:left
2. Dla treści float:right
3. Dla stopki wyłącz opływanie z obu stron: clear:both

I staraj się nie używać pozycjonowania relatywnego (że już nie wspomnę o absolutnym) - podstawa to float + marginesy.
Go to the top of the page
+Quote Post
mike
post
Post #8





Grupa: Przyjaciele php.pl
Postów: 7 494
Pomógł: 302
Dołączył: 31.03.2004

Ostrzeżenie: (0%)
-----


~Pilsener a czemu odradzasz pozycjonowanie relatywne? Posiada ono bardzo duzo możliwści. Dzięki niemu można na przykład pozycjonować absolutnie wg. obietktów pozycjonowanych relatywnie.
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 22.08.2025 - 12:18