0
何らかの理由で、私が底部にあるように指定したにもかかわらず、私のフッタはページの最下部にありません。ここでは、コンテンツの上部にあるページの中央にある写真です。ページの下部にフッターを作成する方法を理解するための助けが必要です。私の写真やコンテンツの上部にはありません。私のページの中央にフッタがあるのはなぜですか？
HTML：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>int222_162d16 - Assignment 2 - Home Page</title>
<link rel="stylesheet" href="css/normalize.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/sitecss.css" type="text/css" media="screen" />
</head>
<body>
<nav class="fixed-nav-bar">
<ul class="nav">
<li class="nav"><a class="nav" href="../index.html">♠ My Zenit Account</a></li>
<li class="nav"><a class="nav" href="index.html">Home</a></li>
<li class="nav"><a class="active" href="gallery.html">Gallery</a></li>
<li class="nav"><a class="nav" href="video.html">Video</a></li>
<li class="nav"><a class="nav" href="audio.html">Audio</a></li>
<li class="nav"><a class="nav" href="table.html">Tables With CSS</a></li>
<li class="nav"><a class="nav" href="pizza/index.html">Forms</a></li>
<li class="nav"><a class="nav" href="css/sitecss.css">CSS Used</a></li>
<li class="nav"><a class="nav" href="extra/index.html">Extra</a></li>
</ul>
</nav>
<h1>Photo Gallery!</h1>
<div>
<aside class="r">
<p class="c"><b><u>Four More Wonders of the World!</u></b></p>
<table>
<ol>
<li><a href="https://en.wikipedia.org/wiki/Great_Pyramid_of_Giza">The Great Pyramid of Giza</a></li>
<li><a href="http://geography.about.com/od/culturalgeography/ss/Seven-Wonders-Of-The-Modern-World.htm#step2">CN Tower</a></li>
<li><a href="http://geography.about.com/od/culturalgeography/ss/Seven-Wonders-Of-The-Modern-World.htm#step3">Empire State Building</a></li>
<li><a href="http://geography.about.com/od/culturalgeography/ss/Seven-Wonders-Of-The-Modern-World.htm#step4">Golden Gate Bridge</a></li>
</ol>
</table>
<p class="c"><b><u>Social Media Links</u></b></p>
<center>
<aside style="position: relative; background: url('images/social-media.png') no-repeat; width: 250px; height: 140px;">
<a href="http://facebook.com" style="width: 23px; height: 23px; border: 0; position: absolute; top: 3px; left: 4px;"></a> <!-- use this as a guide -->
</aside>
</center>
</aside>
<section class="s">
<h3>Why Does A Country Need A Capital City?</h3>
<p>Capital cities are usually known as the administrative centre of the country. They are usually the most populated city
within the country, and the Government will usually have the capital city as the base. Representatives from other embassys
will be based off of the capital city, and same with the civil workers.</p>
</section>
<section class="s">
<h3>China</h3>
<figure>
<figcaption>
The Great Wall of China
</figcaption>
<img src="images/The_Great_Wall_of_China_at_Jinshanling.jpg" alt="The Great Wall of China" title="The Great Wall of China" />
</figure>
The great wall is over twenty-three hundred years old, and it's official length is 21,196.18km. In the first week of may
and October there can be upwards of seventy-thousand people per day and in 2001 there were sixty-three million visiters in Badaling.
The Great Wall was constructed due to the states of Qin, Wei, Zhao, Qi, and Zhongshan having a warring period.
</section>
<section class="s">
<h3>Jordan</h3>
<figure>
<figcaption>
Petra
</figcaption>
<img src="images/rsz_377px-petra_jordan_bw_21.jpg" alt="Petra" title="Petra" />
</figure>
Petra is a archaeological city in southern Jordan. This historical city is known for it's rock-cut architecture and water conduit systems.
Petra also is known as Raqmu to the Nabataeans or Rose City due to the color of the stones which are carved.
</section>
<section class="s">
<h3>Italy</h3>
<figure>
<figcaption>
The Colosseum
</figcaption>
<img src="images/rsz_800px-colosseum_in_rome_italy_-_april_2007.jpg" alt="The Colosseum" title="The Colosseum" />
</figure>
The Colosseum is an oval amphitheatre in the centre of Rome, built of sand and concrete. It is known as the largest amphitheatre ever built. The Colosseum is situated east of the
Roman Forum. The construction started in AD 72 and was completed in AD 80. It could hold an estimated fifty to eighty-thousand people.
</section>
<section class="s">
<h3>Mexico</h3>
<figure>
<figcaption>
Chichen Itza
</figcaption>
<img src="images/Chichen-Itza-Castillo-Seen-From-EastJPG.jpg" alt="Chichen Itza" title="Chichen Itza" />
</figure>
Chichen Itza was known as a focal point in the northern Maya lowlands between six-hundred to twelve-hundred AD. The 10th century saw the rise of the city
as a regional capital controlling the area from central Yucatan to the north coast.
</section>
<section class="s">
<h3>Peru</h3>
<figure>
<figcaption>
Machu Picchu
</figcaption>
<img src="images/800px-Machu_Picchu_Peru.jpg" alt="Machu Picchu" title="Machu Picchu" />
</figure>
Machu Picchu is a Inca citadel situated on a mountain ridge 2430 meters above sea level. Archaeologists believe that Machu Picchu was built as an estate for their emperor,
Pachacuti. It is the most familiar icon of Inca civilization.
</section>
<section class="s">
<h3>India</h3>
<figure>
<figcaption>
Taj Mahal
</figcaption>
<img src="images/rsz_728px-taj_mahal_in_march_2004.jpg" alt="Taj Mahal" title="Taj Mahal" />
</figure>
The Taj Mahal was to be built by the commission of Shah Jahan in 1631, so that he could build the Taj in the memory of his wife, Mumtaz Mahal,
a princess who died giving birth to their 14th child. The construction began in 1632. The tomb is the centrepiece of a 42 acre complex, which includes a mosque and a guest house, and is also set in formal gardens
bounded on three sides by a crenellated wall.
</section>
<section class="s">
<h3>Brazil</h3>
<figure>
<figcaption>
Christ the Redeemer
</figcaption>
<img src="images/rsz_1_cristor_redentor_2014.jpg" alt="Christ the Redeemer" title="Christ the Redeemer" />
</figure>
The idea of building a statue atop Corcovado was suggested in the mid 1850's when a priest, Pedro Maria Boss suggested in placing a Christian monument to honour their princess,
Princess Isabel. The project however wasn't approved until 1889 when the country became a republic and the statue was manufactured alongside the Statue of Liberty. They had required donations to build the monument,
and most donators were Brazilian Catholics.
</section>
</div>
<footer class=f>
<script>
var dt=new Date(document.lastModified); // Get document last modified date
document.write('<p>This page was last updated on '+dt.toLocaleString()) + '</p>';
</script>
</footer>
</body>
</html>
CSS：あなたがスクロールするとき
ul.nav
{
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #f3f3f3;
border: 1px solid #e7e7e7;
box-shadow: 5px 2px 10px #808080;
}
li.nav
{
float: left;
}
li a.nav
{
display: block;
color: #666;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
/* Change the link color on hover*/
li a:hover:not(.active)
{
background-color: #ddd;
}
li a.active
{
display: block;
color: #ffffff;
background-color: #9999ff;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
section.s /*shadow on sections*/
{
background-color: #ccccff;
box-shadow: 2px 2px 2px 1px #808080;
width:78%;
}
aside.r
{
float: right;
width: 20%;
background-color: #ccccff;
box-shadow: 2px 2px 2px 1px #808080;
}
p.c
{
text-align: center;
width: 100%;
}
footer.f
{
bottom: 0;
width: 100%;
background:#ccccff;
color:#000000;
position:absolute;
text-align:center;
font-weight:bold;
display:inline-block;
margin: 0px auto;
line-height:20px;
clear: both;
}
aside p
{
margin-top: 0
}
body
{
background-color: #9F9FFF;
}
html, body
{
max-width: 100%;
/*overflow-x: hidden;*/
margin:0;
}
figcaption
{
font-size: 1em;
border: 1px solid;
margin:0 auto;
text-align:center;
}
figure
{
text-align: center;
}
その後、 'document.write'データを挿入する簡単な方法がありますが動作する固定にフッターの位置を変更してください:) – gcampbell