CSS页脚位置错误

当我试图做一个页脚时，我不能把它放在位置（3）上，而是放在位置（2）上。我的主要部分的位置是

绝对的

，它无法更改，因为我在它上面有

jQuery

脚本（Fadeout/Fadein）。我希望底部有页脚，但我不希望它是

位置：静态的

，我希望我的主要部分能够在我放入更多文本时调整大小

CSS中的我的页脚-页脚 我的主要部分在CSS（div1-div5）里面

html
{
边际：0px；
填充：0px；
边框：0px无；
大纲：0px无；
字体大小：100%；
垂直对齐：基线；
背景：无重复滚动0%0%透明；
最小高度：101%；
}
身体
{
背景图像：url（'/images/tlo.png'）；
背景重复：重复；
字体系列：Tahoma、Verdana、Arial；
边际：0px；
字体大小：100%；
垂直对齐：基线；
}
h1，.腿
{
字体大小：12px；
颜色：橙色；
文本对齐：居中；
}
氢
{
字体大小：12px；
颜色：橙色；
文本对齐：左对齐；
} 
P
{   
颜色：白色；
边缘顶部：.5em；
字体大小：.75em；
左：1%；
右：1%；
}
.对
{   
颜色：白色；
边缘顶部：.5em；
字体大小：.75em；
左：5%；
文本对齐：右对齐；
字体风格：斜体；
}
#顶
{
填充顶部：60px；
垫底：20px；
位置：相对位置；
高度：自动；
宽度：1024px；
溢出：隐藏；
保证金：0px自动；
垂直对齐：基线；
}
导航
{
边界宽度：薄；
边框：1px纯色灰色；
背景图片：url（'/images/tweed.png'）；
}
标题
{
背景图像：url（'/images/tlo.png'）；
}
部分
{
位置：相对位置；
显示：块；
高度：自动；
底部：10%；
文本对齐：居中；
宽度：1024px；
垂直对齐：基线；
保证金：0px自动；
填充：10px；
}
#第一组，第二组，第三组，第四组，第五组
{
位置：绝对位置；
填充：30px；
顶部：0px；
左：0px；
宽度：1024px；
背景图片：url（'/images/podklad.png'）；
垂直对齐：中间对齐；
边界宽度：薄；
边框：1px纯色灰色；
}
#菜单
{
位置：相对位置；
文本对齐：居中；
高度：120px；
宽度：100%；
垂直对齐：基线；
保证金：0px自动；
边界：0px；
字体大小：0px；
背景图片：url（'/images/podklad.png'）；
背景重复：重复；
}  
页脚
{
位置：相对位置；
左：0px；
底部：0px；
高度：100px；
宽度：1024px；
背景图片：url（'/images/podklad.png'）；
背景重复：重复；
垂直对齐：中间对齐；
}
利斯塔
{
文本对齐：居中；
列表样式类型：无；
保证金：0；
}
ul#jezyki
{
列表样式：圆形；
颜色：白色；
边缘顶部：.5em；
字体大小：.75em；
文本对齐：居中；
}
李丽斯塔
{
显示：内联；
保证金：0px自动；
}
林奇先生
{
字体大小：14px；
颜色：白色；
字体大小：粗体；
}
Damian Pruszynski网站设计











自动调整
维塔姆·西娜·莫杰·斯特罗尼。W tym dziale dowiesz sie trochęo autorze；）。纳兹瓦姆：我是普拉辛斯基夫人。信息技术技术公司。研究信息的Aktualnie大学（三韩国）。感兴趣的项目有：napisałeszelakim programowaniem，lecz Najbardzieze programowaniem stron www.Jużw technikum napisałem i zajmowałem sięstronądu szkolnego.Jestem chętny do nauki Rozzijania Swoje wijedzy w Zakrie programowania.Chetnie podejmęęęęęęęęęę28。Potrafie wykonaćrżne横幅/grafiki oraz same strony www.


Znane przez Zennie jezyki，frameworki，aplikacje do programowania：

爪哇
C++
C#
Matlab
HTML5
CSS3
PHP5
jQuery
JavaScript

Chetnie podejmie sie zaprojektowaniu strony www lub pracy jako网页设计师。Mozliwosc kontaktu macie Pans两个w菜单kontakt。这是一个用数字表示的公式

斯特罗纳配子点


Prosta strona poswiecona grom komputerowym。Wykonana jest przy użyciu html、php和css。ciemnych czarno Czeronych kolorach sprawiaże strona jest bardzo czytelna的布局图。波纳多·怀索基·罗兹耶尔佐西·格拉菲卡·乌塔克拉克西尼娅·怀格莱德·斯特罗尼。斯特罗尼·扎斯托索瓦诺·波比埃拉贾斯·达尼奇·斯克里普蒂为斯特罗尼提供信息。斯特罗纳·扎维拉（Strona zawiera）是一位管理者。扎普拉萨米·多奥格尔达尼亚和奥西尼亚



斯特罗纳·科拉·诺科维戈


斯特罗纳·波维科纳开玩笑说，科努·诺科韦姆。Wykonana jest przy użyciu html、php和css。Obrazek strony może wskazywaćinnego autora lecz由ła提交给strona tworzona zamówienie i Przypanie nowego autora由ło konieczne提交。背景：jasnych kolorach sprawiaże strona jest bardzo czytelna。波纳多·怀索基·罗兹耶尔佐西·格拉菲卡·乌塔克拉克西尼娅·怀格莱德·斯特罗尼。斯特罗尼·扎斯托索瓦诺·波比埃拉贾斯·达尼奇·斯克里普蒂为斯特罗尼提供信息。斯特罗纳·扎维拉（Strona zawiera）是一位管理者。扎普拉赞·多奥格尔达尼亚



莫杰斯塔尔投资组合


mojego starego项目。Strona miała问题z wyswietlaniem na Rozdzielczosch ponizej 1280x960。这是一个很好的例子。nadziejęze aktualna夫人，我是波多巴。W nowym projekcie musiałem porzucićmenu W jQuery ponieważnie pasowało do nowego layoutu

康塔克托维公式
html
{
   margin: 0px;
   padding: 0px;
   border: 0px none;
   outline: 0px none;
   font-size: 100%;
   vertical-align: baseline;
   background: none repeat scroll 0% 0% transparent;
   min-height:101%;
}
body
{
   background-image: url('/images/tlo.png');
   background-repeat:repeat;
   font-family: Tahoma,Verdana,Arial;
   margin: 0px;
   font-size: 100%;
   vertical-align: baseline; 
}
h1, .leg
{
   font-size:12px;
   color: orange;
   text-align:center;
}
h2
{
   font-size:12px;
   color: orange;
   text-align:left;
} 
p     
{   
   color: white;   
   margin-top: .5em;  
   font-size: .75em;  
   padding-left:1%;  
   padding-right:1%;    
}
.right  
{   
   color: white;   
   margin-top: .5em;  
   font-size: .75em;  
   padding-left:5%;  
   text-align:right;
   font-style:oblique;
}
#top
{
   padding-top:60px;
   padding-bottom:20px;
   position:relative;
   height:auto;
   width:1024px;
   overflow:hidden;
   margin: 0px auto;
   vertical-align:baseline;
}
nav
{
   border-width: thin;
   border:1px solid gray;
   background-image: url('/images/tweed.png');
}
header
{
   background-image: url('/images/tlo.png');
}
section
{
   position:relative;
   display:block;
   height:auto;
   bottom:10%;
   text-align:center;
   width:1024px;
   vertical-align:baseline;
   margin: 0px auto;
   padding:10px;  
}
#div1,#div2,#div3,#div4,#div5
{
   position:absolute;
   padding:30px;
   top:0px;
   left:0px;
   width:1024px;
   background-image: url('/images/podklad.png');
   vertical-align:middle;
   border-width: thin;
   border:1px solid gray; 
}
#menu
{
   position:relative;
   text-align: center;
   height:120px;
   width:100%;
   vertical-align:baseline;
   margin: 0px auto;
   border:0px;
   font-size:0px;
   background-image:url('/images/podklad.png');
   background-repeat:repeat;
}  
footer
{
   position:relative;
   left:0px;
   bottom:0px;
   height:100px;
   width:1024px;
   background-image:url('/images/podklad.png');
   background-repeat:repeat;
   vertical-align: middle;
}
ul.lista
{
   text-align:center; 
   list-style-type:none; 
   margin:0; 
}
ul#jezyki
{
   list-style: circle;  
   color: white;   
   margin-top: .5em;  
   font-size: .75em; 
   text-align:center;
}
li.lista
{
   display:inline;
   margin: 0px auto;
}
.linki
{
   font-size:14px;
   color:white;
   font-weight:bold;
}

<?php
session_start();    
?>

<!doctype html>
<head>
<title>Damian Pruszynski Webdesign</title>
<link rel="stylesheet" type="text/css" href="styles.css" />
<link href='http://fonts.googleapis.com/css?family=Habibi' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="sliding_effect.js"></script>
<script type="text/javascript" src="mojefunkcje.js"></script>

<meta name="keywords" content="Damian Pruszynski, webdesign, bialystok webdesign, strony www, programowanie bialystok, pisanie stron www, pisanie stron www bialystok, robienie stron www bialystok, robienie stron" />
        <meta name="description" content="Damian Pruszynski - strona domowa, programowanie i webdesign. Programowanie stron www - HTML5 CSS3 jQuery. Skrypty PHP5 Javascript. Bannery oraz grafiki promujące. Łatwo tanio i przyjemnie."/>
        <meta name="author" content="Damian Pruszyński"/>
        <meta name="robots" content="index,follow" />
        <meta charset="UTF-8"/>
</head>
<body>
<div id="container">
<header>
<a href="//plus.google.com/115218512345333970807?prsrc=3" rel="publisher" target="_top"></a>
<a href="https://plus.google.com/114098387423288903496?rel=author"></a>
<div id="toppodklad"></div>
<div id="top">
<img src="/images/logotop.png" alt="logo glowne" />
</div>

</header>

<nav>
<div id="menu">
<ul class="lista">

<li class="lista"><a id="pokaz1" href="#" ><img src="/images/pasek_01.png" alt=" "  /></a></li>
<li class="lista"><a id="pokaz2" href="#" ><img src="/images/pasek_02.png" alt=" "  /></a></li>
<li class="lista"><a id="pokaz3" href="#" ><img src="/images/pasek_03.png" alt=" "  /></a></li>
<li class="lista"><a id="pokaz4" href="#" ><img src="/images/pasek_04.png" alt=" "  /></a></li>
<li class="lista"><a id="pokaz5" href="#" ><img src="/images/pasek_05.png" alt=" "  /></a></li>
</ul>

</div>
</nav>
<br>
<br>
<section>
<div id="div1" style="z-index:5" >
<?php
        include("newsy.php");
?>
</div>

<div id="div2" style="z-index:4" >
<h1>O autorze</h1>
        <p>Witam Cię na mojej stronie. W tym dziale dowiesz sie trochę o autorze ;). Nazwyam sie Damian Pruszynski mam 22lata. Skonczylem technikum informatyczne ZSRCKP w Białymstoku. Aktualnie studiuję informatyke na Uniwersytecie w Białymstoku (III rok). Interesuję się wszelakim programowaniem, lecz najbardziej programowaniem stron www.Już w technikum napisałem i zajmowałem się stroną samorządu szkolnego.Jestem chętny do nauki i rozwijania swojej wiedzy w zakresie programowania.Chetnie podejmę sie pracy w agencji programistyczno-reklamowej. Potrafie wykonać różne bannery/grafiki oraz same strony www.<br><br></p>
        <h1>Znane przez zemnie jezyki, frameworki, aplikacje do programowania:</h1>
        <div id="divjezyki">
        <ul id="jezyki">
        <li>Java</li>
        <li>C++</li>
        <li>C#</li>
        <li>Matlab</li>
        <li>HTML5</li>
        <li>CSS3</li>
        <li>PHP5</li>
        <li>jQuery</li>
        <li>JavaScript</li>
        </ul>

        <p>Chetnie podejmie sie zaprojektowaniu strony www lub pracy jako webdesigner. Mozliwosc kontaktu macie Panstwo w menu kontakt. Znajduje sie tam formularz kontaktowy a także numer telefonu.</p>
        </div></div>
<div id="div3" style="z-index:3" >
<div id="kontener1">


        <div id="tekst1">
        <h1>Strona GameSpot</h1>
        <br>
        <p> Prosta strona poswiecona grom komputerowym. Wykonana jest przy użyciu html, php a także css. Layout o ciemnych czarno czerwonych kolorach sprawia że strona jest bardzo czytelna. Ponadto wysokiej rozdzielczosci grafika uatrakcyjnia wyglad strony. Na stronie zastosowano pobierajace dane z baz danych skrypty do późniejszego wyświetlenia informacji na stronie. Strona zawiera także prosty skrypt logowania dla administratorow. Zapraszamy do oglądania i oceniania.</p>

        <h1><a class="linki" href="http://activerankings.vxm.pl/index.php">Link do strony.</a></h1>
        </div>
        </div>
        <br>
        <div id="kontener2">


        <div id="tekst2">
        <h1>Strona kola naukowego</h1>
        <br>
        <p>Strona poświęcona jest kołu naukowemu. Wykonana jest przy użyciu html, php a także css. Obrazek strony może wskazywać innego autora lecz była to strona tworzona na zamówienie i przypisanie nowego autora było konieczne. Background o jasnych kolorach sprawia że strona jest bardzo czytelna. Ponadto wysokiej rozdzielczosci grafika uatrakcyjnia wyglad strony. Na stronie zastosowano pobierajace dane z baz danych skrypty do późniejszego wyświetlenia informacji na stronie. Strona zawiera także prosty skrypt logowania dla administratorow. Zapraszam do oglądania.</p>

        <h1><a class="linki" href="http://dariusznoob.vxm.pl/index.php">Link do strony.</a></h1>
        </div>
        </div>

        <div id="kontener3">


        <div id="tekst3">
        <br>
        <h1>Moje stare portfolio</h1>
        <br>
        <p>Projekt mojego starego potfolio. Strona miała problemy z wyswietlaniem na rozdzielczosciach ponizej 1280x960. Dlatego byłem zmuszony do jej zmienienia. Mam nadzieję ze aktualna bardziej sie wam podoba. W nowym projekcie musiałem porzucić menu w jQuery ponieważ nie pasowało do nowego layoutu.</p>

        <h1><a class="linki" href="http://starydpwebmastering.vxm.pl/index.php">Link do strony.</a></h1>
        </div>
        </div>
        </div>
<div id="div4" style="z-index:2" >
<fieldset class="leg">
        <legend>Formularz kontaktowy</legend>

        <?php include('mail.php'); ?>
        </fieldset>

        <fieldset>
        <legend class="leg" >Dane kontaktowe</legend>
        <p>Telefon: 793403039</p>
        <p>Adres email: kontobia@gmail.com</p>
        </fieldset></div>
<div id="div5" style="z-index:1" >
<h1>System Logowania Administratora</h1>
        <br>



        <?php

        if (isset($_SESSION['login']))
        {
        include("zalogowany.php");

        }
        else
        {
        include("logowanie.php");
        }
        ?>

        <br>
</div>

</section>

<br>
<br>
<br>
<br>


</div>

</body>

</html>

footer
{
position:fixed;
left:0px;
bottom:0px;
height:100px;
width:1024px;
background-image:url('/images/podklad.png');
background-repeat:repeat;
vertical-align: middle;
}

#divid:after {
   content: " "; /* Older browser do not support empty content */
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
}

.footer:before {
   content: " "; /* Older browser do not support empty content */
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
}

.clear {
display:block;
float:none;
clear:both;
height:0px;
width:100%;
margin:0;
padding:0;
border:0;
}