Patička na konci stránky

Místo pro dotazy a rady ohledně programovacích jazyků (C++, C#, PHP, ASP, Javascript, VBS..) a tvorby webových stránek

Moderátor: Mods_senior

Odpovědět
samak55
nováček
Příspěvky: 3
Registrován: 23 úno 2010 15:42

Patička na konci stránky

Příspěvek od samak55 »

Dobrý den, mám takový problém. Potřebuji umístit patičku (a nějaké další divy) na konec stránky, aby vždy byly dole nehledě na velikost textu. Mohli by jste mi říci, kde dělám chybu? Jsem začátečník a moc se v tom ještě nevyznám. Děkuji
kód:

Kód: Vybrat vše

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  <meta name="generator" content="PSPad editor, www.pspad.com">;
  <title></title>
  <style type="text/css">
<!--
html, body {
    height: 100%;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0
}
html>body {
    font-size: small;
}
*|html[xmlns*=""]  #main {
     display: table;
     height: 100%
}
 
 #main {
 min-height: 100%;
 margin: 0 auto;
 width: 1000px;
 position: relative;
 height: 100%;
 background: green
 }
 body>#main {
     height: auto;
 }
 
 #hlavicka {
 position: absolute;
 background-image: URL('images/web_01.gif');
 width:1000px;
 height:42px;
 top: 0px;
 left: 0px
  }
 
  #lsloupec {
  position: absolute;
  background-image: URL('images/web_02.gif');
  width:39px;
  height:802px;
  top: 42px;
  left: 0px
  }
  #odkaz {
  position: absolute;
  background-image: URL('images/web_03.gif');
  width:899px;
  height:145px;
  top: 42px;
  left: 39px
  }
  #psloupec {
  position: absolute;
  background-image: URL('images/web_04.gif');
  width:62px;
  height:145px;
  top: 42px;
  left:938px
  }
  #pododkaz {
  position: absolute;
  background-image: URL('images/web_05.gif');
  width:900px;
  height:25px;
  top: 187px;
  left: 39px
  }
  #bannery {
  position: absolute;
  background-image: URL('images/web_06.gif');
  width:61px;
  height:657px;
  top: 187px;
  left: 939px
  }
  #menu {
  position: absolute;
  background-image: URL('images/web_07.gif');
  width:189px;
  height:477px;
  top:212px;
  left: 39px
  }
  #prouzek {
  position: absolute;
  background-image: URL('images/web_08.gif');
  width:37px;
  height:477px;
  top: 212px;
  left: 228px
  }
  #obsah {
  position: absolute;
  background-image: URL('images/web_09.gif');
  width:674px;
  min-height:477px;
  top:212px;
  left: 265px
  }
  #podpaticka {
  position: absolute;
  background-image: URL('images/web_12.gif');
  width:900px;
  height:35px;
  bottom:0px;
  left: 39px;
  overflow: hidden;
  }
  #paticka {
  position: absolute;
  background-image: URL('images/web_11.gif');
  width:900px;
  height:89px;
  overflow: hidden;
  bottom:35px;
  left: 39px
  }
  #podobsah {
  position: absolute;
  background-image: URL('images/web_10.gif');
  width:900px;
  height:31px;
  top: 689px;
  left: 39px
  }
-->
</style>

  </head>
  <body>
<div id="main">
<div id="hlavicka">Hlavicka</div>
<div id="lsloupec">Levz sloupec</div>
<div id="odkaz">Odkaz</div>
<div id="psloupec">Pravz sloupec</div>
<div id="pododkaz">Pod odkazem</div>
<div id="bannery">Bannery</div>
<div id="menu">Menu</div>
<div id="prouzek">Prouyek</div>
<div id="obsah">Obsah</div>
<div id="podpaticka">Pod paticka</div>
<div id="paticka">Paticka</div>
<div id="podobsah">Pod obsaem prouzek</div>
</div>
  </body>
</html>
Uživatelský avatar
CZechBoY
Master Level 9.5
Master Level 9.5
Příspěvky: 8813
Registrován: 20 srp 2008 14:02
Bydliště: Brno
Kontaktovat uživatele:

Re: Patička na konci stránky

Příspěvek od CZechBoY »

Zdravim a Vítej na PC-HELP !
pokud chceš mít patičku úplně u dolního kraje prohlížeče tak se to dá udělat přes CSS a position: absolute dáš tam bottom: 0 a je to :) problém je však v tom že když budeš mít text delší než šířku prohlížeče tak bude patička přes ten text, nebo když má někdo malé rozlišení třeba.
zkus udělat nějaký sloupcůvý menu třeba aby si měl tu patičku vždy dole
PHP, Nette, MySQL, C#, TypeScript, Python
IntelliJ Idea, Docker, Opera browser, Linux Mint
iPhone XS
Raspberry PI 3 (KODI, Raspbian)
XBox One S, PS 4, nVidia GeForce NOW
samak55
nováček
Příspěvky: 3
Registrován: 23 úno 2010 15:42

Re: Patička na konci stránky

Příspěvek od samak55 »

No, ale to jsem udělal a nějak to nefakčí
Uživatelský avatar
CZechBoY
Master Level 9.5
Master Level 9.5
Příspěvky: 8813
Registrován: 20 srp 2008 14:02
Bydliště: Brno
Kontaktovat uživatele:

Re: Patička na konci stránky

Příspěvek od CZechBoY »

ten kód vůbec nechápu... používej syntax BBCode
v tom tvým kódu máš takovejch kravin že to ani nechápu, třeba to vypisování všech tagů html, to neznáš hvězdičku * ?
pošli web kde to máš a já ti řeknu co tam máš blbě

ukázka patičky s position: absolute a relative
PHP, Nette, MySQL, C#, TypeScript, Python
IntelliJ Idea, Docker, Opera browser, Linux Mint
iPhone XS
Raspberry PI 3 (KODI, Raspbian)
XBox One S, PS 4, nVidia GeForce NOW
Odpovědět
  • Podobná témata
    Odpovědi
    Zobrazení
    Poslední příspěvek
  • Web stránky se nedají načítat
    od jurasek9 » » v Problémy s hardwarem
    5 Odpovědi
    6560 Zobrazení
    Poslední příspěvek od jurasek9
  • Mobilní aplikace ve stylu webové stránky
    od bradto » » v Programování a tvorba webu
    3 Odpovědi
    6124 Zobrazení
    Poslední příspěvek od HelFix

Zpět na „Programování a tvorba webu“