Week 3 Lab

About This Week

This week's lab will have us build a simple web page containing an image and some sample text, a button, and ultimately a popup form that we can animate as it makes its appearance

Lab Visuals

Animation example one
Animation example two
Transition hover example

Example Popup Form



Input Form

X

Ups and Downs

One of the biggest ups this week was successfully getting the popup form to appear exactly where I wanted it—right under the button, without overlapping other sections. It was satisfying to see the animation and layout work as expected after some CSS tweaking. I also felt more confident using positioning strategies like `relative` and `absolute` to control layout flow. On the downside, I initially struggled with the form appearing in unexpected places and overlapping other content. Understanding how different positioning methods behave took some trial and error. Debugging animations and spacing was a bit tricky, but ultimately rewarding. It showed me how small CSS properties can make a big difference in layout control

Download Lab Files

Download Week 3 Lab (ZIP)