| Autor | Zpráva | ||
|---|---|---|---|
| Pavlínka Profil * |
#1 · Zasláno: 11. 11. 2015, 19:52:40
vytvářím na webu okno s diskuzí...
hlavičku mám vysokou 56px; a chtěla bych div který bude mít 100% výšku mínus 80px na další div s možností zapisování. tz.: <!-- zde bude hlavicka --> <div id="text"> text uživatele s -moz-scrollbars-vertical;</div> <div id="pridejtext">textove pole s 80px vyskou které stále bude vidět i bez rolování :)</div> <!-- paticka viditelna po srolovani nize --> moc se mi nevede :) děkuji za rady |
||
| DarkMeni Profil |
#2 · Zasláno: 11. 11. 2015, 21:23:23
Přes tabulku by to šlo udělat jednoduše. Jestli to chceš přes div tak mě napadá asi jedině přes absolutní pozicování
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
html, body { height: 100%; padding: 0px; margin: 0px; }
.obal
{
height: 100%;
position: relative;
}
.hlavicka
{
height: 56px;
background: Orange;
}
.text
{
background: SteelBlue;
position: absolute;
top: 56px;
bottom: 80px;
overflow: auto;
width: 100%;
}
.odsazeni { padding: 10px; }
.pridej-text
{
height: 80px;
width: 100%;
background: LightBlue;
position: absolute;
bottom: 0px;
}
.paticka { background: Orange; }
</style>
</head>
<body>
<div class="obal">
<div class="hlavicka"></div>
<div class="text">
<div class="odsazeni">
Text
</div>
</div>
<div class="pridej-text">
<div class="odsazeni">
Přidej text
</div>
</div>
</div>
<div class="paticka">
<div class="odsazeni">
Patička
</div>
</div>
</body>
</html> |
||
|
Časová prodleva: 3 dny
|
|||
| Pavlínka Profil * |
#3 · Zasláno: 14. 11. 2015, 17:13:19
nedá mi to se nezeptat...
jak to lze udělat přes tabulku? |
||
| DarkMeni Profil |
Třeba takle
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
html, body { height: 100%; margin: 0px; }
.main
{
width: 100%;
height: 100%;
border-collapse: collapse;
}
.hlavicka { height: 56px; background: LightGreen; }
.text { overflow: auto; background: SteelBlue; }
.napsat-koment { height: 80px; background: LightBlue; }
.paticka { padding: 20px; background: #432356; }
</style>
</head>
<body>
<table class="main">
<tr><td class="hlavicka">
<tr><td class="text">
<tr><td class="napsat-koment">
</table>
<div class="paticka">(c) 2015 ...</div>
</body>
</html>Tady je to vysvětlený: Tabulkový layout nezrychlíte Jo a pořád si nejsem jistej jestli sem dobře pochopil co se snažíš udělat, možná by bylo lepší kdybys to třeba nakreslila.. |
||
| Tomáš123 Profil |
#5 · Zasláno: 15. 11. 2015, 08:34:21
DarkMeni:
Namiesto značiek tabuľky existujú tabuľkové hodnoty displayu.
|
||
| DarkMeni Profil |
#6 · Zasláno: 15. 11. 2015, 18:28:20
Tomáš123:
Jo no ale to se pak chová stejně ne? (jakože se to zobrazí až po tom co se načte celej obsah) Pavlínka: Asi už vim o co ti jde, jestli chceš aby stránka šla normálně rolovat ale pole pro přidání textu se rolovalo s ní a když se dojede k patičce tak aby zůstalo před ní a nepřekrylo jí - tak to přes css jen tak neuděláš. Můžeš ale použít javascript a po události onscroll zjistit jestli už dosáhnul patičky a když jo, tak position: fixed přepnout na position: absolute nebo ho prostě vypnout
|
||
| Tomáš123 Profil |
DarkMeni:
„ale to se pak chová stejně ne?“ Môžeš skúsiť. V IE8 mi zobrazí text skôr aj keď použijem obyčajnú tabuľku. Starší ani novší nemám. Firefox 42.0 načítanie obrázkov vzdáva, zobrazí namiesto nich ikonku slepého odkazu. Iný prehliadač momentálne nemám po ruke. Kto chce, testujte. Pre mobilné pripojenia: Použité obrázky majú obrovské rozmery a dátový objem zhruba 10kB. |
||
|
Časová prodleva: 6 dní
|
|||
| Pavlínka Profil |
#8 · Zasláno: 21. 11. 2015, 12:16:30
nene jde mi o to, že s hlavičkou a patičkou nechci moc hýbat (je o již hotový web a nerada bych změnou narušila zobrazení na jiných stránkách)
a do pole kde mám běžně text chci div-vík který se bude roztahovat dle velikosti textu... viz ctrlv.cz/shots/2015/11/21/zTFy.png v malování jsem nikdy nebyla dobrá :D |
||
|
Časová prodleva: 8 let
|
|||
0