CPSC270
Software Engineering and Project Design

Activity 3

CSS Layouts

Complete the following MDN Test Your Skills:

  1. Floats Skills
  2. Position Skills

Use CSS floats and position to modify the layout of your recipe web page. The page should do the following:

  1. wrap the description text around the image. If the desciption does not have enough text, you may need to shrink the image and / or add extra text.
  2. position the title inside of a div that is always at the top of the window. When the page is scrolled to the top, it should not block any content below it. When the page is scrolled down, content should be occluded behind it. If there is not enough content to scoll the page, feel free to add dummy text to make it larger.