stopka na dole strony

[arturooo]

Witam. Od około miesiaca meczę sie z tą stopką. Przejrzałem wiele stron i spróbowałem różne kombinacje z kodami ale wciaż nie potrafie sprowadzić stopki na koniec strony. PROSZE pomóżcie!!!

body{   background-color:white;
	color:black;
	font-size: 20px;
	font-family:cursive,sans-serif;}
#container{background-color:white;
	   width:100%; 
	   margin: auto;
position: relative;}
h4, h1{
    text-align: center;
}
.logo{	text-align: center;
  	vertical-align: middle;
	padding: 0px;
	vertical-align: bottom;
	background-color: white;}
.logo2{
	
	float:none;}
.start, galeria, omnie,faq{color:black;
	text-align: center;
	padding-top:20px; 
	margin-top: 15px;
	margin-left:27px;
	margin-right: 20px; 
	background-color: #FFFF00;
 	height: 80px;
 	min-width:25%;
	float:left;}
.start:hover,.omnie:hover,.galeria:hover,.faq:hover{
	background-color: #DDDD00;
	     cursor:pointer;
min-width:25%;}
#zobacz{color:black;
	clear:both;
	float:left;
	margin-top: 8%;
	margin-right:1%;
	padding-left:1%;
	padding-bottom:2%;
	width: 15%;
	height:auto;
	background-color: #9999CC;
	text-align:left;
	border-radius: 50px;
	/*obramowanie / grubosc obramowania */ 
	border-style:double;
	border-width: 0px;
	font-size: 20px;
	
}
#tekst{
	float:left;
	margin-top: 3%;
	margin-left: 0%;
	margin-right: 0%;
	padding:2%;
	width: 62%;
	height:auto;
	background-color: white;
	background-position: bottom;
	font-size: 25px;}
#tekstglowny{text-align: center;
	float:left;
	margin-top: 3%;
	margin-left: 0%;
	margin-right: 0%;
	padding:2%;
	width: 62%;
	height:auto;
	background-color: white;
	background-position: bottom;
	font-size: 25px;}
#reklama{
	float:right;
	margin-top:3%;
	width: 15%;
	background-image: url("0.png");
	background-repeat: no-repeat;
	background-position:center;
	height:450px;
	background-color:white;
	margin-left:2%;
	
	}
#komentarz{
	padding-top: 20px;
	font-family: serif;
	
	clear:both;}
#footer{display: block;
	margin: 0 auto;
	font-family: serif;
	font-size: 70%;
	/*margin-top:10px;*/
	border-top-style: dotted;
	border-width: 2px;
	text-align: center;
	padding-top:1%;
	position:absolute;bottom:0;
	width: 100%;
	;
	}
/*.gallery{
	float:left;
	width:65%;
	text-align: center;
	height:auto;}*/
.foodtable{display: block;
	border-spacing: 1px 60px;
	width:100%;
	margin: 0 auto; 
	text-align: center;}
.foodphotos{height:120%;
	    width:100%;
	    }
 .foto2{
	 float:left;
	padding-top:3%;
	padding-left:3%;
		width: 30%;
		height:180px;
		}
.foto0{ display: block;
	width: 99%;
	height:300px;
	margin: 0 auto;}
.foto{ width:30%;
	height:180px; 
	text-align: center;
	padding:5px;}
.thx{margin:0 auto;
display: block;
height: 400px;
background-position: bottom;
text-align: center;}
#tekstgallery{
	margin-top: 3%;
	float:left;
	width:65%;
	text-align: center;
	height:auto;}
	/*powieksza obrazek po najchaniu*/
.foto:hover {
    transform: scale(2);}
.foto2:hover {
    transform: scale(2);}
	
	
.pojemnik1{
	text-align: center;
	color:black;
	font-size: 200%;
	margin-top: 5px;
	margin-left:auto;
	margin-right: auto;
	background-color:#EAEAAE;
	height: 80px;
	width:100%; }
.sticky{
	width: 100%;
	position:fixed;	
	margin:auto;
	top: 5px;
	z-index: 100%;
}
#about{
	
	font-size: 100%;}
ol{padding:0;
   margin: 0;
   list-style-type:none;
   font-size: :100%;
   width:100%;
   height:80px;
   line-height:200%;
   display:inline-block;
	
}
/*ustalamy wyglad linkow w menu rozwijanym*/
ol a{
	color:black;
     text-decoration: none;
     display: block;
        overflow:hidden;

}
ol>li{
	float:left;
width:20%;
height: 80px;
margin-left:4%;
}
ol>li:nth-child(1){
	background-color:#A68064;
	border-radius: 10px;}
ol>li:nth-child(2){
	background-color:#A68064;
	border-radius: 10px;}
ol>li:nth-child(3){ 
	background-color:#A68064;
	border-radius: 10px;}
ol>li:nth-child(4) { 
	background-color:#A68064;
	border-radius: 10px;}

/*zmienia sie kolor tla po najechaniu*/
ol > li:hover{background-color: #B68e6D;}
/*zmienia kolor czcionki po najechaniu*/
ol > li:hover > a
{color: white;}
/*stylizujemy wewnetrzną*/
ol > li > ul
{
	list-style-type: none;
	padding: 0;
	margin: 0;
	height: 40px;
	display: none;
}
ol > li:hover > ul
{display: block;}
ol > li > ul > li
{
	background-color:#EAEAAE;
	position: relative;
	z-index: 100;
	border-top: 1px dashed #751b1b;
	border-radius: 10px;
	border:groove;
	border-color: #B68e6D;
	font-size: 30px;
}
ol > li > ul > li:hover
{background-color: #B68e6D;}
ol > li > ul > li:hover > a
{color: white;}


/*usuwa podkreslenie i zmienia kolor odnośnika(linku) w całym pliku! */
a:link, a:visited, a:focus { text-decoration: none; color:black;}
a:hover{color:blueviolet;}

<!DOCTYPE HTML>
<html lang="pl-PL">
<head>
	<meta name="description" content="Philippines-I love it!"/>
	<meta name="keywords" content="Ph, foods, traditional, island, dream, culture, palms "/>
	<title>♥Philippines ♥</title>
	<meta charset="utf-8"/>
	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<link rel="stylesheet" href="wyglad.css" type="text/css"/><!-- dolaczenie css do html-->
	<link rel="stylesheet" href="menulista.css" type="text/css"/><!-- dolaczenie css do html-->
	<link href='.....?family=Dancing+Script' rel='stylesheet' type='text/css'>
	<script async src="js/jquery-1.6.4.js"></script><!-- ładowane asynchorniczne-przyespiesz twieranie strony-->
</head>
<body>

<div id="container">
		
			<div class="logo"> <img  height="250" width="100%" id="obrazek" src="0.jpg"  alt="tapeta" /> </div>
			<div class="logo2"><img  class="logophoto" src="0.jpg" alt="zdjecie"></div>
			<div class="pojemnik1">
				<ol id="menu">
					<li><a href="start.html">Start</a></li>
					<li><a href="#">Info</a>
				<ul>
					<li><a href="country.html">About country</a></li>
					<li><a href="culture.html">Amazing culture</a></li>
					<li><a href="foods.html">Strange foods</a></li>
					<li><a href="reasons.html" >50 Reasons</a></li>
				</ul></li>
					<li><a href="#">Gallery</a><ul>
					<li><a href="philipines.html">Philippines</a></li>
					<li><a href="city.html">Iligan</a></li>
					<li><a href="vampire.html">My Vampire</a></li>
			   	</ul></li>
					<li><a href="#">FAQ</a><ul>
					<li><a href="me.html">About me</a></li>
					<li><a href="ph.html"> About Ph</a></li>
					<li><a href="would.html">Iwould...</a></li>
				</ul></li>
				</ol>	
			</div>
			<div id="zobacz"><br/><center><b>Also look at:</b></center>
 	 			<ul type="I">
					<li ><a href="">Consulate republic of Poland in the Philippines<br/></a></li>
					<li><a href="">20 amazing photos<br/></a></li>
					<li><a href="">Ph-all in one<br/></a></li>
				</ul>  	      
	 		</div>
			<div id="tekstglowny" >
				<p>Are you looking for information of the Philippines?</p>
				<p>Are you thinking about traveling to this country?</p> Not?
				<p>So maybe are u looking for curiosities about this country?</p>
				<p>If your answer on the one of above question sound "YES",then you come at the right place</p></br></div>
			<div id="reklama"></div>
			<div id="komentarz"></div>
			<div id="footer" > Artur Dróżdż ©2016 Warszawa,Polska</div>
</div>
<script src="jquery-1.11.3.min.js"></script>	
</body>
</html>

[przemek3653]

wrzuciłem na codepen i wyświetla się na dole. Może wystarczy odświeżyć bez cache (Ctrl + F5)?

[arturooo]

jak zwęże okno to stopka wyświtla się w połowie okna,a pod nią jest sporo białego miejsca

Dobrze to widac jak na telefonie otworzysz

//artur236         .cba.pl        /ph/me     .html

[przemek3653]

reklamy z cba Ci rozwalają stronę. Lokalnie pod FF stopka na wszystkich rozdzielczościach działa dobrze.

Postaw stronę na jakimś normalnym hostingu. Z darmowych kiedyś korzystałem z jatsu.pl, nie wiem jak jest teraz.

[atomatic]

Nie jest to przyczyną Twojego problemu, ale dwa razy wczytujesz jquery, do tego w różnych wersjach (na początku i na końcu). Nie wczytuj skryptów jeśli z nich nie korzystasz.