Päta v layoute – CSS – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu
Reklama
Reklama

Päta v layoute – CSS – Fórum – Programujte.comPäta v layoute – CSS – Fórum – Programujte.com

 

Hledá se programátor! Plat 1 800 € + bonusy (firma Boxmol.com)
daemontus0
Newbie
17. 7. 2009   #1
-
0
-

Robil som si klasicky layout - menu na ľavo, hlavička s loginom, hlavná časť a päta. Všetko funguje na prvý pohľad tak ako má. Problém ale nastane ak je obsah menu, hlavnej časti alebo hlavičky dlhší ako 100% výšky stránky, päta sa mi zobrazí hneď pod hlavičkou a prekryje ju. takto nejak vyzerá môj kód:
CSS:

#container {

height: 100%;
margin: 0 auto;
width: 1000px;
}
#menu {
border: 1px solid;
float: left;
margin: 0 auto;
width: 190px;
}
#login {
border: 1px solid;
float: right;
height: 5%;
margin: 0 auto;
width: 800px;
}
#main {
border: 1px solid;
float: right;
margin: 0 auto;
text-align: center;
width: 800px;
}
#bottom {
border: 1px solid;
height: 50px;
margin: 0 auto;
width: 500px;
float: left;
clear: both;
}

HTML:
<html>

<head>
<META http-equiv="Content-Type" content="text/html; charset=Windows-1250">
<title>Nova stranka</title>
<link type="text/css" href="style/layout.css" rel="stylesheet"/>
</head>
<body>
<div ID="container">
<div ID="menu">
menu
</div>
<div ID="login">
login
</div>
<div ID="main">
main
</div>
<div ID="bottom">
obsah bottom
</div>
<font size="1">Optimalizované pre rozlíšenie 1024x768<font>
</div>
</body>
</html>

Je to len čistá koncepcia layoutu bez akýchkoľvek farieb + (skoro)všetky časti majú rámik aby bolo jasné kde sa nachádzajú - ten pôjde po doladení preč.
P.S. - skúšal som aj presunutie bottomu v celkovej hierarchii(tj. pod container aj do containera), prípadne rôzne zarovnania a šírky.
P.P.S - to isté mi robí aj ten nápis: "optimalizované pre rozlíšenie 1024x768"

Nahlásit jako SPAM
IP: 213.253.204.–
Veľkosť posluchárne nerobí myšlienku múdrou.
Reklama
Reklama
Kobi
~ Moderátor
+1
Věrný člen
17. 7. 2009   #2
-
0
-

Nevím v čem máš chybu, každopádně výšku nedávej v procentech, ale fixně. Výšku celého kontejneru zruš (height 100%) a nech to rozšiřovat podle výšky obsahu. Pokud něčemu přiřadíš float: (right|left), je blbost dávat tomu ještě margin: 0px auto.

Nahlásit jako SPAM
IP: 90.178.69.–
daemontus0
Newbie
17. 7. 2009   #3
-
0
-

No, môj problém to síce nerieši ale ďakujem. Myslím že to tam ani nebolo pôvodne, bola to skôr časť mojich pokusov riešiť to ale zabudol som to zmazať.

Nahlásit jako SPAM
IP: 213.253.204.–
Veľkosť posluchárne nerobí myšlienku múdrou.
Kobi
~ Moderátor
+1
Věrný člen
17. 7. 2009   #4
-
0
-

Dej sem screenshot jak to vypadá, nemám teď prostředky na to zkoušet to na vlastním PC.

Nahlásit jako SPAM
IP: 90.178.69.–
daemontus0
Newbie
18. 7. 2009   #5
-
0
-

No, vyzerá to asi nejak takto:

Nahlásit jako SPAM
IP: 213.253.204.–
Veľkosť posluchárne nerobí myšlienku múdrou.
daemontus0
Newbie
18. 7. 2009   #6
-
0
-

Alebo, ak je obsah trochu dlhší, tak to je asi takéto, ale myslím že to je ten istý problém

Nahlásit jako SPAM
IP: 213.253.204.–
Veľkosť posluchárne nerobí myšlienku múdrou.
daemontus0
Newbie
18. 7. 2009   #7
-
0
-

No, chyba nakoniec odstránená - pomýlil som si zdrojáky - res. keďže som na to hneď neprišiel, chvíľu som písal do jedného a potom do druhého a tak som si vytvoril neukončenú tabuľku teda bottom sa logicky snažil dostať ešte pred ňu. :smile14:

Nahlásit jako SPAM
IP: 213.253.204.–
Veľkosť posluchárne nerobí myšlienku múdrou.
Zjistit počet nových příspěvků

Přidej příspěvek

Toto téma je starší jak čtvrt roku – přidej svůj příspěvek jen tehdy, máš-li k tématu opravdu co říct!

Ano, opravdu chci reagovat → zobrazí formulář pro přidání příspěvku

×Vložení zdrojáku

×Vložení obrázku

Vložit URL obrázku Vybrat obrázek na disku
Vlož URL adresu obrázku:
Klikni a vyber obrázek z počítače:

×Vložení videa

Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×
 
Podporujeme Gravatara.
Zadej URL adresu Avatara (40 x 40 px) nebo emailovou adresu pro použití Gravatara.
Email nikam neukládáme, po získání Gravatara je zahozen.
-
Pravidla pro psaní příspěvků, používej diakritiku. ENTER pro nový odstavec, SHIFT + ENTER pro nový řádek.
Sledovat nové příspěvky (pouze pro přihlášené)
Sleduj vlákno a v případě přidání nového příspěvku o tom budeš vědět mezi prvními.
Reaguješ na příspěvek:

Uživatelé prohlížející si toto vlákno

Uživatelé on-line: 0 registrovaných, 8 hostů

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032016 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý