Ogłoszenie |
Forum archiwalne, nie można zakładać nowych kont.
|
Odnośnie warstw (html) |
Wersja do druku |
ka_tka ![Kobieta Płeć:Kobieta](https://grzejnik.kotatsu.pl/forum/Tanuki/images/icon_minigender_female.png)
![](https://grzejnik.kotatsu.pl/forum/avatars/207770461846c857a20754b.gif)
Dołączyła: 12 Lip 2002 Skąd: Warszawa Status: offline
|
Wysłany: 31-10-2005, 14:56 Odnośnie warstw (html)
|
|
|
A dokładniej odnośnie warstw relative.
Założenie - coby się centrowało w rozdzielczości wyższej niż 800x600. Jest sobie tabelka. W niej 3 warstwy. Jedna warstwa to obrazek (logo u góry tabelki właściwie), druga to menu (winno być po lewej), trzecia - treść (po prawej). I właśnie z menu i treścią mam mały problem ^^"
Otóż wychodzi mi na to, że relative to one są względem siebie. Czyli jeśli w kodzie pierwsza (właściwie druga, o obrazku nie wspominam, bo jest z nim spokój) znajdzie się warstwa z menu, każda dodana do niej linijka tekstu sprawi, iż warstwa z treścią zjedzie niżej. I vice versa. I ja wiem, że to się da ominąć, tylko nie mogę, noo ^^" |
|
|
|
|
![](https://grzejnik.kotatsu.pl/forum/Tanuki/images/spacer.gif) |
tilk ![Mężczyzna Płeć:Mężczyzna](https://grzejnik.kotatsu.pl/forum/Tanuki/images/icon_minigender_male.png)
![](https://grzejnik.kotatsu.pl/forum/avatars/14019702484de128fe680d9.gif)
Dołączył: 24 Lip 2003 Status: offline
Grupy: Alijenoty
|
Wysłany: 31-10-2005, 17:48
|
|
|
Próbujesz uzyskać następujący układ tabelaryczny?
Kod: |
odstep ---------- odstep
<----> | | <---->
|----------|
| | |
| | |
----------
<---------->
stala szerokosc
|
Krótka odpowiedź wyglądałaby tak: nie da się. Microsoft zapomniał zaimplementować elementy CSS2 dotyczące układu tabelarycznego...
Pełna odpowiedź brzmi tak, że istnieją metody, żeby taki układ udawać. W najprostszym przypadku - przy braku stopki - wystarczy pozycjonować menu bezwzględnie (absolute), podając jego położenie i szerokość, a treść pozycjonować standardowo, dodając jednak lewy margines o szerokości menu. Aby uzyskać centrowanie i stałą szerokość, należy zamknąć oba w elemencie pozycjonowanym względnie, o stałej szerokości, z automatycznymi marginesami.
Przykład:
Kod: |
<div style="width: 750px; margin-left: auto; margin-right: auto; position: relative">
<div style="height: 50px">
Nagłówek
</div>
<div style="position: absolute; left: 0px; top: 50px; width: 150px">
Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu
Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu
Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu
</div>
<div style="margin-left: 160px">
Treść Treść Treść Treść Treść Treść Treść Treść Treść
Treść Treść Treść Treść Treść Treść Treść Treść Treść
Treść Treść Treść Treść Treść Treść Treść Treść Treść
Treść Treść Treść Treść Treść Treść Treść Treść Treść
</div>
</div>
|
Jeśli potrzeba czegoś w stopce, braki IE sprawiają, że robi się nieciekawie. Najprościej chyba jest ominąć problem używając floatów:
Kod: |
<div style="width: 750px; margin-left: auto; margin-right: auto">
<div style="height: 50px">
Nagłówek
</div>
<div style="float: left; width: 150px">
Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu
Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu
Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu
</div>
<div style="float: right; width: 590px">
Treść Treść Treść Treść Treść Treść Treść Treść Treść
Treść Treść Treść Treść Treść Treść Treść Treść Treść
Treść Treść Treść Treść Treść Treść Treść Treść Treść
Treść Treść Treść Treść Treść Treść Treść Treść Treść
</div>
<div style="clear: both">
Stopka
</div>
</div>
|
Mam nadzieję, że właśnie o to pytałaś, bo wyraziłaś się bardzo niekonkretnie... |
|
|
|
|
![](https://grzejnik.kotatsu.pl/forum/Tanuki/images/spacer.gif) |
ka_tka ![Kobieta Płeć:Kobieta](https://grzejnik.kotatsu.pl/forum/Tanuki/images/icon_minigender_female.png)
![](https://grzejnik.kotatsu.pl/forum/avatars/207770461846c857a20754b.gif)
Dołączyła: 12 Lip 2002 Skąd: Warszawa Status: offline
|
Wysłany: 31-10-2005, 21:19
|
|
|
Tak, tak, ja wiem, że ja się w tych sprawach wyrażam tak... humanistycznie? ^^"
Ale właśnie tak, o to mi chodziło, spróbuję się w to w ten sposób pobawić, a w razie czego będę wołać jeszcze :P
Na razie wielkie dzięki! ^___^
Ach, i ja nie próbuję uzyskać, ja próbuję ratować. Po Profesjonaliście, co to nie wiedział, że istnieją inne rozdzielczości niż 1024x700ileśtam, czy że niektórzy lubią okienko zmniejszać. Tak, są tacy, których dzieła wymagają nawet mojej pomocy XD Pokazałabym, ale nie będę antyreklamy biednej znajomej mamuś i jej gabinetowi robić ^^" |
|
|
|
|
![](https://grzejnik.kotatsu.pl/forum/Tanuki/images/spacer.gif) |
ka_tka ![Kobieta Płeć:Kobieta](https://grzejnik.kotatsu.pl/forum/Tanuki/images/icon_minigender_female.png)
![](https://grzejnik.kotatsu.pl/forum/avatars/207770461846c857a20754b.gif)
Dołączyła: 12 Lip 2002 Skąd: Warszawa Status: offline
|
Wysłany: 01-11-2005, 17:47
|
|
|
Znowu pytanie - wobec drugiej opcji (tej pozwalającej na stopkę):
Czy jest możliwość przesunięcia samego menu ("float: left") trochę w prawo? Bo chwilowo wyłazi mi poza grafikę ^^" "margin-left" działa, ale wtedy znowu wysokość treści zależy mi od ilości linijek w menu... |
|
|
|
|
![](https://grzejnik.kotatsu.pl/forum/Tanuki/images/spacer.gif) |
ka_tka ![Kobieta Płeć:Kobieta](https://grzejnik.kotatsu.pl/forum/Tanuki/images/icon_minigender_female.png)
![](https://grzejnik.kotatsu.pl/forum/avatars/207770461846c857a20754b.gif)
Dołączyła: 12 Lip 2002 Skąd: Warszawa Status: offline
|
Wysłany: 02-11-2005, 19:11
|
|
|
Cofam pytanie, poradziłam sobie, z nastaniem nowego dnia mnie oświeciło XD
Niniejszym kod dzieła jest równie poplątany co ten autorstwa Profesjonalisty, ale się wreszcie toto nie rozjeżdża, ani na innych rozdzielczościach, ani w innych przeglądarkach ^__^ |
|
|
|
|
![](https://grzejnik.kotatsu.pl/forum/Tanuki/images/spacer.gif) |
|
Nie możesz pisać nowych tematów Nie możesz odpowiadać w tematach Nie możesz zmieniać swoich postów Nie możesz usuwać swoich postów Nie możesz głosować w ankietach Nie możesz załączać plików Możesz ściągać załączniki
|
Dodaj temat do Ulubionych
|
|
|
|