Layout pt 3 Assignment Explained
Listed below are the steps you need to follow to complete the layout part 3 assignments.
- The textbook emphasized layouts that use float and clear. I considered eliminating the lesson on absolute positioning, however students often wrote to me that they appreciated learning about absolute positioning. I have kept those demonstrations on the DVD even though they are no longer in the textbook.
- Open the DVD > css-part2 > start-here.html > layout [pt 3] lesson. Here is a list of what you need to watch for the first 2 assignments.
* 2 col. absolute
* 3 col. absolute
* add a header
* order of content
* absolute resources
* files used in this lesson
- The 2 column absolute page will have a fixed width for the first column and a fluid width that adjusts to the browser window in the second column. This is not exactly what the text book demonstrates, however I have found this layout to be extremely popular and wanted students to create it.
Save the file as "2col-absolute.html" and place it in the "samples" folder.
- The next homework assignment asks you to create a 3 column layout where the left and right columns are fixed and the center column stretches and shrinks to accommodate the size of the browser window.
Save the file as "3col-absolute.html" and place it in the "samples" folder.
- Next, add header code to the 3 column absolute sample. Adjust the top postion value to acomodate the height of the header. Save the file as "3col-absolute-header.html" and place it in the "samples" folder.
- The final homework assignment asks you to create a page that lists content in one order on the HTML page and displays that content in another order in the browser. Follow the model of the page found at layout [pt 3] lesson > order of content. Save the file as "order-content.html" and place it in the "samples" folder.
- Please upload the files (including your modified homework page) onto "student". Use a Web browser to view your homework page and click on the links to make sure the homework page links to the new files you have created.
- I will use the "student work" page to grade your work.