Lab 10, Lay out a page

Due the end of class session on July 20. You may have 24 hours extension.

Your task

1. First, make a copy of this version of an index page for wyrd.
2. Second, make a copy of the associated CSS file.
3. Study the HTML source code to see what basic blocks are there. Notice that many divisions have IDs.
4. Edit the CSS so that the page looks like the following image. Do not modify the HTML, only the CSS.
5. Submit your exercise on Blackboard. Attach both the .html file and the .css file.

Note: the initial CSS for the page demonstrates how to use an image as the marker on a list with he list-style-image property.

Click to enlarge.

Evaluation Checklist:

• Background changed
• rounded corner implemented
• Two main divs arranged as columns
• "Comment to" disappeared
• Footers centered (clear: both;)
• Badge div sized and centered
• list styled without image bullets, instead using list-style-type none

Submisson

Submit all the related files to the blackboard or upload all the files to wyrd and submit the wyrd link to the blackboard.