| Autor | Zpráva | ||
|---|---|---|---|
| Daviart Profil |
#1 · Zasláno: 7. 5. 2010, 22:17:30
CSS pro mě není neznámá, ale až nyní jsem narazil na takovou drobnost. Doposud jsem nepotřeboval, aby se mi prvek DIV přizpůsoboval velikosti okna prohlížeče na výšku.
Vím, že tabulka umí widht a height 100% a tím se držet okrajů okna. U divů jsem zatím používal jen widht 100%. Ale narazil jsem, že výška u divu nejde stanovovat v procentech. Proto bych měl prosbu, jestli někdo nemá nějakou fintu, jak divu určit plovoucí hodnotu na výšku (respektive aby se na výšku přilepil na okraje okna prohlížeče). Tabulky na rozvržení nepoužívám a výjimku dělat nechci. |
||
| Radek9 Profil |
#2 · Zasláno: 7. 5. 2010, 22:20:52
html, body {
height: 100%;
} |
||
| Bubák Profil |
#3 · Zasláno: 8. 5. 2010, 00:15:55
Co se týče procentní výšky, tak se tabulky i DIVy chovají stejně.
Rozdíly jsou napříč prohlížeči a vykreslovacími režimy, standard - quirk, souvisí s !doctype. |
||
| Daviart Profil |
#4 · Zasláno: 8. 5. 2010, 16:14:36
Díky, už mi to jak štakš funguje, ale stále to nedělá co bych chtěl, ale na to snad již přijdu :). (jinak se zas ozvu..)
|
||
| Daviart Profil |
#5 · Zasláno: 10. 5. 2010, 00:39:55
Ještě bych měl takovou drobnost. Níže uvedené css my funguje přesně podle představ (až na .okno-stred). Zarovnaní na střed, pohyblivá velikost dle výšky a zápatí vždy dole. Pak mám soubor který vkládám do prvního objektu pomocí include (.okno-stred). Pokud si zobrazím stránku samotnou, drží si div class=okno-stred 100% výšky. Pokud jí zobrazím include, div má velikost dle obsahu. Má otázka je. Jak zápis v .okno-stred upravit tak, aby další divy měli stejné chování a drželi si také 100%ní velikost.
Nejspíš je to banalita, ale o držení velikosti dle stránky jsem se zatím moc nezajímal. /*CSS*/
html, body {
height: 100%;
margin: 0px;
padding: 0px;
}
body {
text-align: center;
_text-align: center; /* IE */
background-color: #FFF;
}
.okno {
width: 810px;
height: auto;
min-height: 100%;
_height: 100%; /* IE */
text-align: left;
margin: 0 auto;
position: relative;
}
.zapati {
width: 100%;
position: absolute;
bottom: 0;
left: 0;
height: 20px;
background-color: #FFF;
}
.okno-stred{
background-image: url(./grafika/okno_modra_b.png);
background-repeat: repeat-y;
width: auto;
height: auto;
min-height: 100%;
_height: 100%; /* IE */
position: relative;
padding-top: 10px;
padding-right: 25px;
padding-bottom: 20px;
padding-left: 25px;
}
/* HTML */
<body>
<div class="okno">
<div class="menu"></div>
<div class="okno-stred"></div> /* includovaný soubor */
<div class="zapati">
</div>
</div>
</body>
ilustračně, zjednoduženě to mám asi takto. |
||
|
Časová prodleva: 14 let
|
|||
0