Lab 15: Practice with Display, Overflow, White Space, and Cursor

Instructions:

  1. This lab will give you practice with the properties introduced in Lecture 20.
  2. Create a new, strict XHTML file for this and populate it with content of your choice (appropriate to a school assignment, of course).
  3. Include a public-domain photo or one of your own. Display it four times.
    • The first two times, display it twice in one paragraph.
    • Then, display the photo twice in a second paragraph, but apply a class to these photos so that they display as "block".
    • See the difference between the paragraphs.
  4. Create 4 paragraphs of content. (This may be the same content repeated 4 times.)
    • Give a width and a height to the paragraphs which are too small to hold all the content.
    • Apply the 4 different values for the overflow property, one to each paragraph.
    • Compare the results. Also, compare the results between an IE browser and a different browser
  5. Repeat the previous 4 paragraphs, adding minimum and maximum height and widths to them. See how these render.
  6. Add cursor properties to the different elements of your web page.
  7. Validate your XHTML and CSS.
  8. Upload your files to the server and also copy them to your removable media.