Autor | Zpráva | ||
---|---|---|---|
RadimCZ Profil |
Dobrý den jsem začátečník a mám dotaz. Potřebuju , aby divy na mojem webu byly pořád "ve stejné pozici" . Například aby se footer neposouval podle toho jak moc textu je v contentu. (Myšleno čím méně textu v contentu , tím footer více nahoře a naopak.) tady je kdyžtak kousek CSS souboru:
body {background-image:url("bgimg.jpg");} #box {width:1200px;margin:auto;border:2px solid black;} #banner {width:1200px;height:250px;background-image:url("header.jpg");} #cssmenu {width:200px;float:left;} #content {width:1000px;float:right;background-color:rgba(9,5,5,0.6);} #content p {width:900px;color:#bea562;} #footer {width:1200px;background-image:url("footerimg.jpg");clear:both;color:#bea562;} Předem mockrát děkuji za odpověď. |
||
Tomáš123 Profil |
#2 · Zasláno: 11. 11. 2014, 13:57:50
RadimCZ:
Pozrite si kód tejto stránky. Je tam zobrazený jednoduchý princíp funkcie. |
||
RadimCZ Profil |
#3 · Zasláno: 11. 11. 2014, 14:14:04
Tomáš123:
takže třeba u toho "boxu" nastavit "min-height" ? ale i potom se mi footer posouva pořád nahoru a nějak nevím jak na to :( |
||
Tomáš123 Profil |
#4 · Zasláno: 11. 11. 2014, 14:34:37
RadimCZ:
„ale i potom se mi footer posouva pořád nahoru a nějak nevím jak na to :(“ Na to, aby vlastnosť min-height fungovala, musí mať každý nadradený prvok nastavenú výšku (height ) ideálne v percentách (t.j. 100%)
|
||
RadimCZ Profil |
#5 · Zasláno: 11. 11. 2014, 14:47:31
Tomáš123:
Jediný nadřazený prvek tomu "boxu" je "body" ne? a ikdyž u něho zapíšu height:100%; tak to nepomůže. |
||
Tomáš123 Profil |
#6 · Zasláno: 11. 11. 2014, 14:56:02
RadimCZ:
Priložte prosím živú ukážku stránky. |
||
RadimCZ Profil |
Tomáš123:
Tady je první verze s dlouhým contentem kdy je footer dole: http://www.ztw.xf.cz/index.php a tady verze bez contentu kdy se footer háže pořád nahoru a nezůstává na určitém (níže položeném) místě: http://www.ztw.xf.cz/index2.php |
||
Tomáš123 Profil |
RadimCZ:
„nezůstává na určitém (níže položeném) místě“ [#4] <body> nemá výšku 100%.
1) Nastavte <body> výšku (height ) 100%;
2) Nastavte div u box minimálnu výšku (min-height ) 100%;
3) Div u box nastavte relatívnu pozíciu (position: relative; );
4) Päte nastavte absolútnu pozíciu ( position: absolute ) s hodnotou bottom: 0;
Tu je príklad http://kod.djpw.cz/nhhb, na ktorom stačí upraviť hodnoty podľa vlastného vkusu. „Jediný nadřazený prvek tomu "boxu" je "body" ne?“ Nielen <body> ... Ešte <html>
|
||
RadimCZ Profil |
Tomáš123:
Děkuji mockrát vyzkouším to . Chtěl jsem se ještě zeptat jak nastavit , aby ta lehce pruhledna černá barva na pozadí contentu zasahovala úplně přes celý ten content? Aby nebyla nad footerem ta mezera jako v tomto odkazu?: www.ztw.xf.cz/index3.php . |
||
Tomáš123 Profil |
#10 · Zasláno: 11. 11. 2014, 19:57:58
RadimCZ:
„aby ta lehce pruhledna černá barva na pozadí contentu zasahovala úplně přes celý ten content?“ Ak je obsahová časť kratšia ako navigácia, päta sa vykreslí až pod menu, teda rozdiel výšok navigácie a obsahovej časti tvorí výšku pásika. Dá sa to vyriešiť napríklad nastavením contentu minimálnej výšky rovnakej alebo väčšej hodnoty ako je výška menu alebo nastavením pozadia obaľovaciemu div u (v tomto prípade div.box ). Všetko bude rovnakej farby (ak to nebude prekryté iným prvkom), bez ohľadu na to, čo má akú výšku.
|
||
Časová prodleva: 9 let
|
0