CSci 4657 Lab 2. Due Monday, January 31 at 11:59pm

Goals of this lab:

You may work alone or in pairs.

Lab task

You are given the following source file: 

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!-- 
Author: Elena Machkasova elenam@morris.umn.edu 
Last modified: 1/25/11
--> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>CSci 4657 example of CSS layout</title>
<link rel="stylesheet" type="text/css" href="your_css.css" />
<style type="text/css">
div {
       border: black solid 1px; /* for debugging purposes */
}

#navigation {
       background-color: #90EE90;
}
#block1 {
       background-color: #FFFF00;
}

#block2 {
       background-color: #FFA500;
}

#block3 {
       background-color: #FFC0CB;
}


#footer {
       background-color: #ADD8E6;
}
</style>
</head>
<body>
<div id="navigation">
<ul style="list-style-type: none">
<li>Chapter One</li>
<li>Chapter Two</li>
<li>Chapter Three</li>
<li>Chapter Four</li>
</ul>
</div>
<h1>The Hobbit</h1>
<div id="block1">
In a hole in the ground there lived a hobbit. Not a nasty, dirty, wet 
hole, filled with the ends of worms and an oozy smell, nor yet a dry, bare, 
sandy hole with nothing in it to sit down on or to eat: it was a hobbit-hole, 
and that means comfort. 
It had a perfectly round door like a porthole, painted green, with a 
shiny yellow brass knob in the exact middle. The door opened on to a tubeshaped 
hall like a tunnel: a very comfortable tunnel without smoke, with 
panelled walls, and floors tiled and carpeted, provided with polished chairs, 
and lots and lots of pegs for hats and coats - the hobbit was fond of 
visitors. 
</div>
<div id="block2">
The tunnel wound on and on, going fairly but not quite straight into 
the side of the hill - The Hill, as all the people for many miles round called 
it - and many little round doors opened out of it, first on one side and then 
on another. No going upstairs for the hobbit: bedrooms, bathrooms, cellars, 
pantries (lots of these), wardrobes (he had whole rooms devoted to clothes), 
kitchens, dining-rooms, all were on the same floor, and indeed on the same 
passage. The best rooms were all on the left-hand side (going in), for these 
were the only ones to have windows, deep-set round windows looking over his 
garden and meadows beyond, sloping down to the river. 
This hobbit was a very well-to-do hobbit, and his name was Baggins. The 
Bagginses had lived in the neighbourhood of The Hill for time out of mind, and 
people considered them very respectable, not only because most of them were 
rich, but also because they never had any adventures or did anything 
unexpected: you could tell what a Baggins would say on any question without 
the bother of asking him. This is a story of how a Baggins had an adventure, 
found himself doing and saying things altogether unexpected. He may have lost 
the neighbours' respect, but he gained- well, you will see whether he gained 
anything in the end. 
</div>
<div id="block3">
The mother of our particular hobbit ... what is a hobbit? I suppose 
hobbits need some description nowadays, since they have become rare and shy of 
the Big People, as they call us. They are (or were) a little people, about 
half our height, and smaller than the bearded Dwarves. Hobbits have no beards. 
There is little or no magic about them, except the ordinary everyday sort 
which helps them to disappear quietly and quickly when large stupid folk like 
you and me come blundering along, making a noise like elephants which they can 
hear a mile off. They are inclined to be at in the stomach; they dress in 
bright colours (chiefly green and yellow); wear no shoes, because their feet 
grow natural leathery soles and thick warm brown hair like the stuff on their 
heads (which is curly); have long clever brown fingers, good-natured faces, 
and laugh deep fruity laughs (especially after dinner, which they have twice a 
day when they can get it). Now you know enough to go on with.
</div>
<div id="footer">
The Hobbit page was brought to you by The Hobbit fans.
</div>

</body>
</html>

Your goal is to implement the following layout:

Below are the specific requirements:

At the end of the lab we will compare different solutions.

What to submit.

Send me (CC your partner(s)) your .html and .css files.

This page is a part of CSci 4657 course web site.