Description
Overview
For this lab, you will create a CSS stylesheet for an HTML web page provided with this lab (also see figure
1). You can find the supporting files for this lab in the ‘Lab Assignments’ section on Blackboard, in a file
called Lab01_Base_Files.zip.
Instructions
Use a float layout to ensure that the header section is at the top. Use display: table-row to get the left,
centred, and right justified components on the header as in figure 2. The navigation bar consists of an
unordered list, with list items for each navigable button. These items would be clickable in a production
website, but are not for the purposes of this lab.
The chat tool should be absolutely positioned in the bottom right corner of the page (it will overlap any
content in that area). This, too, would be clickable in a real web site, but will not be for our purposes.
Many other components need adjustment in other ways (e.g. image size, background colours, borders, list
styles, margins, padding, etc.
2
Figure 1: The unstyled web page
3
Figure 2: The styled web page
How to Submit
Submit the HTML file and CSS file in a ZIP file, with a name following the same pattern as previous labs:
Lab01_FirstNameLastName_StudentNumber.zip (e.g. Lab01_RandyFortier_100539147.zip) to the TA.
