Autor Zpráva
Camo
Profil
Prosím vás ak niekto môže pozrite sa mi na to.
Problém je v tom, že FF mi nereaguje na height:100%
Robil som to podľa Plaváčkovho návodu, a ten aj funguje(keď ho skúšam samostatne), ale keď ho implementujem do toho môjho kódu, tak tá výška pri malom obsahu je menej ako 100% a teda je tá pata kdesi uprostred stránky.
Už nato pozerám neviem koľkú hodinu, ale nič nevidím....
Kód:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <meta name="generator" content="PSPad editor, www.pspad.com">;
  <title></title>
<script type="text/javascript">
var oldID="PROFIL";
function zobraz(ID){
					 document.getElementById(ID).style.display="block";
					 if(oldID!=ID)document.getElementById(oldID).style.display="none";
					 else return false;
					 oldID=ID;
					 }

</script>
<style type="text/css">
html,body,div,a,ul,li,form,h1,h2{margin:0px; padding:0px; font-family:impact; outline:0}
#MENUDIV{position:absolute; top:0px; right:20px; padding-left:250px}
menu{margin-top:0px; list-style-type:none; margin-right:15px; letter-spacing:2px}
menu li, menu li ul li{display:block; position:relative; margin:0px; padding:0px; float:right; width:120px; overflow:visible; text-align:center; background-color:#580403}
menu a{display:block; padding:0px 2px 5px 2px; font:20px impact; color:#f00050; text-decoration:none}
a:active {outline: none; border:0px solid green; border-style:none}
menu a:hover{color:#d0507f; background-image:url('beautifulAnch2.jpg'); background-repeat:no-repeat; background-position:center top}
menu li ul{display:none; position:absolute; top:29px; left:0px; list-style-type:none; margin:0px; padding:0px}
menu li:hover ul{display:block}
menu li:hover ul li{border-top:1px solid #664466}

<!-- Pata vzdy dole -->
html, body {height: 100%;}
#OBAL{height: 100%;min-height: 100%;position: relative;}
body>#OBAL{height:auto}
#PATA{position: absolute; bottom:0px; left:0px; background: #facf00; margin:0px; padding:0px; width:100%}
</style>

</head>
<body>
<div id="OBAL" style="background-color:#eeeeee">
<div id="HEADER" style="background-color:#580403; max-width:1200px; margin:0px auto; padding-top:55px; position:relative; top:0px; left:0px">
  <img src="beautiful42.jpg" style="width:100%; display:block; margin:0px" />
  <div id="MENUDIV">
    <menu>
      <li><a href="">Fotogaléria</a></li>
		<li><a href="#kontaktANCH" onclick="zobraz('KONTAKT'); return false;">Kontakt</a></li>
      <li><a href="">Dizajn</a><ul>
	                             <li><a href="">Dizajn1</a></li>
										  <li><a href="">Dizajn2</a></li>
										  <li><a href="">Dizajn3</a></li>
										  </ul>
										</li>
      <li><a href="#AtelierANCH" onclick="zobraz('ATELIER'); return false;">Atelier</a></li>
		<li><a href="#ponukaANCH" onclick="zobraz('PONUKA'); return false;">Ponuka</a></li>
      <li><a href="#profilANCH" onclick="zobraz('PROFIL'); return false;">Profil</a></li>
     </menu>
   </div>
   <h1 style="letter-spacing:2px; font-size:40px; position:absolute; top:5px; left:30px"><span style="color:#a1968b">HTML</span> <span style="color:white; font-size:53px"> CSS</span><br><span style="color:#dbd7d3">Javascript PHP</span><span style="color:#64a749">  MySQL<br></span><span style="color:#a1968b">Grafika</span>  <span style="color:white; position:relative; top:17px; left:7px">Webdizajn</span>
      </h1>
</div>

<div id="OBSAH" style="background-color:#eeeeee; max-width:1200px; margin:0px auto; padding-top:50px">

  <div id="PROFIL"><a name="profilANCH"></a>	 <hr>
    <h1 style="margin:0px 20px; margin-bottom:20px; font:25px impact; letter-spacing:7px">Vitajte na mojich osobných stránkoch!
     </h1>
     <p style="padding:0px 20px; line-height:250%; text-indent:40px; font:18px tahoma; line-height:150%" >Nachádzate sa na doméne camo.tym.sk. Používam ju ako priestor na moje pokusy s webovými technológiami. Môžete tu nájsť ukážky grafiky, ktorú tvorím pomocou editoru Gimp, svet mojimi očami vo fotogalérii, odkazy na moje obľúbené témy, ukážky Javascriptu, HTML, CSS a čo nevidieť aj PHP a MySQL. Tak prosím pochopte, že tento web nieje nièím viac, než takou malou skúšobòou, v ktorej niektoré pokusy, môžu spôsobiť skľúčenosť, pocit nenaplnenia, či rozpaky. Ak by sa vám ale cez to všetko moja práca pozdávala, môžete ma kontaktovať priamo zo stránky.
       <br>Prajem vám pekný deň a dovidenia nabudúce!
       <hr>
      </p>
    </div>

  <div id="PONUKA" style="display:none"><a name="ponukaANCH"></a>
	  <hr>
	  <h1 style="font:25px impact; line-height:190%; letter-spacing:2px; padding:20px">@ Dizajn a programovanie WWW stránok<br>@ HTML, CSS, Javascript, PHP, MyQL<br>@ Opravy a upravy kodu
		 </h1>
      <hr>
    </div>

  <div id="KONTAKT" style="display:none"><a name="kontaktANCH"></a>
		<hr>
      <form id="mail" action="mail.php5" method="post" style="padding:15px; margin:5px 0px 15px 0px; color:#333333">
         &nbsp adresa:&nbsp<input name="adresa" type="text" readonly="" value="vladimir.camaj@gmail.com" size="30" style="background-color:#fdfff7" />&nbsp&nbsp&nbsp
         predmet:&nbsp<input name="predmet" type="text" readonly="" value="camo.tym.sk" size="30" style="background-color:#fdfff7" /><br /><br />
         &nbsp správa:&nbsp<textarea name="sprava" align="middle" cols="65" rows="7" style="background-color:#fdfff7"  /></textarea><br /><br />
         <input type="submit" value="odoslať" size="10" />&nbsp
       </form>
      <hr>
     </div>

  <div id="ATELIER" style="display:none"><a name="atelierANCH"></a>
      <iframe name="frejm" src="frejm.html" height="800px" width="99%" style="margin:20px 0px 30px 0.45%; padding:0px">
		 </iframe>
    </div>



</div>

<div id="PATA">Toto je pata...!
     </div>
</div>
</body>

</html>
whysper93
Profil
Já bych asi zkusil místo min-height:100% dát height:100% třeba to půjde :D
Camo
Profil
Nie v tom by to nemalo byť....
Camo
Profil
Torchu som to osekal ,aby sa v tom dalo lepšie vyznať.
Toto je kód od Plaváčka, ktorý by to mal celé zabezpečiť:
html, body {height: 100%;}
#OBAL{height: 100%;min-height: 100%;position: relative;}
body>#OBAL{height:auto}
#PATA{position: absolute; bottom:0px; left:0px; background: #facf00; margin:0px; padding:0px; width:100%}

A toto je ten osekaný môj:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <meta name="generator" content="PSPad editor, www.pspad.com">;
    <title></title>
<style type="text/css">
html,body,div,a,ul,li,form,h1,h2{margin:0px; padding:0px; font-family:impact; outline:0}
#MENUDIV{position:absolute; top:0px; right:20px; padding-left:250px}
menu{margin-top:0px; list-style-type:none; margin-right:15px; letter-spacing:2px}
menu li, menu li ul li{display:block; position:relative; margin:0px; padding:0px; float:right; width:120px; overflow:visible; text-align:center; background-color:#580403}
menu a{display:block; padding:0px 2px 5px 2px; font:20px impact; color:#f00050; text-decoration:none}
a:active {outline: none; border:0px solid green; border-style:none}
menu a:hover{color:#d0507f; background-image:url('beautifulAnch2.jpg'); background-repeat:no-repeat; background-position:center top}
menu li ul{display:none; position:absolute; top:29px; left:0px; list-style-type:none; margin:0px; padding:0px}
menu li:hover ul{display:block}
menu li:hover ul li{border-top:1px solid #664466}

<!-- Pata vzdy dole -->
html, body {height: 100%;}
#OBAL{height: 100%;min-height: 100%;position: relative;}
body>#OBAL{height:auto}
#PATA{position: absolute; bottom:0px; left:0px; background: #facf00; margin:0px; padding:0px; width:100%}
</style>

</head>
<body>
<div id="OBAL" style="background-color:#eeeeee">

<div id="HEADER" style="background-color:#580403; max-width:1200px; margin:0px auto; padding-top:55px; position:relative; top:0px; left:0px">
    <img src="beautiful42.jpg" style="width:100%; display:block; margin:0px" />
    <div id="MENUDIV">
      <menu>
        <li><a href="">Fotogaléria</a></li>
        <li><a href="#kontaktANCH" onclick="zobraz('KONTAKT'); return false;">Kontakt</a></li>
        <li><a href="">Dizajn</a><ul>
                                                        <li><a href="">Dizajn1</a></li>
                                                        <li><a href="">Dizajn2</a></li>
                                                        <li><a href="">Dizajn3</a></li>
                                                  </ul>
                                      </li>
        <li><a href="#AtelierANCH" onclick="zobraz('ATELIER'); return false;">Atelier</a></li>
        <li><a href="#ponukaANCH" onclick="zobraz('PONUKA'); return false;">Ponuka</a></li>
        <li><a href="#profilANCH" onclick="zobraz('PROFIL'); return false;">Profil</a></li>
     </menu>
   </div>
   <h1 style="letter-spacing:2px; font-size:40px; position:absolute; top:5px; left:30px">Webdizajn</h1>
</div>

<div id="OBSAH" style="background-color:#eeeeee; max-width:1200px; margin:0px auto; padding-top:50px">

  <div id="PROFIL"><a name="profilANCH"></a>     <hr>
    <h1 style="margin:0px 20px; margin-bottom:20px; font:25px impact; letter-spacing:7px">Vitajte na mojich osobných stránkoch!
     </h1>
    <p style="padding:0px 20px; line-height:250%; text-indent:40px; font:18px tahoma; line-height:150%" >Tutok, keď je málo textu, tak sa PATA ocitne niekde v strede stránky. A to je PROBLEM!!!<br>Prajem vám pekný deň a dovidenia nabudúce!</p>
  </div>
</div>

<div id="PATA">Toto je pata...!
     </div>
</div>

</body>
</html>


Do kelu, ked som to osekal, tak to funguje. Teraz co?
Camo
Profil
Tak to ako sa zdá funguje, aj keď neviem prečo....
Pochybujem, že by sa niekomu chcelo zisťovať prečo to pred tým nešlo, ale ak by sa taký našiel, tak bude mať moje sympatie.)
Síce tomu moc neverím, ale tie sympatie stoja za úvahu, čo myslíte? .)
Camo
Profil
Pardón ja sa ospravedlňujem ale je to stále na prd. Tá eufória pred tým bola spôsobená tým, že som si to zabudol otvoriť vo FF. Pozeral som si to a radoval sa iba nad IE.
HILFE!!!
habendorf
Profil
Sticky footer
Camo
Profil
OK už som na to prišiel.
Bol to tento riadok: <!-- Pata vzdy dole --> v sekcii style.
Vie mi niekto vysvetliť prečo to nefungovalo?
Ešte teraz mi je z toho zle....
tiso
Profil
Camo:
<!-- HTML komentar -->
<style type="text/css">
/*CSS komentar*/
</style>
Camo
Profil
Takže to je v tom type="text/css"...?
panther
Profil
Camo:
Takže to je v tom type="text/css"...?
ne, je to v tom, že CSS komentáře se zapisují jinak než HTML komentáře (ty jsi měl HTML komentář uvnitř CSS).
Camo
Profil
Ok, a čo by sa stalo, keby som dal css komentáre do html?
Načo je komu toľko druhov komentárov?
tiso
Profil
Camo: miesto pýtania si to môžeš vyskúšať.
Camo
Profil
Ale ako budem vedieť či sa niečo stalo, alebo nie? Ani na toto som nevedel prísť dva dni... Komentár fungoval, ale pri tom ešte nenápadne zrušil CSS, aj to len v niektorých prehliadačoch.
Ale vďaka za snahu, aspoň v tomto už mám jasno...
tiso
Profil
Camo: „Ale ako budem vedieť či sa niečo stalo, alebo nie?
Metódou pozrieš sa a vidíš... Čakal som od teba viacej snahy.
Camo
Profil
Lenze neviem co mam cakat. Ak to bude nieco radikalne, tak si to vsimnem, ale ak to bude nieco zaludne, tak nemam sancu a preto sa pytam....

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0