Skip to content

Latest commit

 

History

History
36 lines (19 loc) · 1.18 KB

README.md

File metadata and controls

36 lines (19 loc) · 1.18 KB

🏗️ Implement Absolute and Relative Positioning to Change Layout

Work with a partner to implement the following user story:

  • As a developer, I want to use the CSS position property to change the layout of my page.

Acceptance Criteria

  • It's done when box 2 is positioned in the middle of square 1 using relative positioning.

  • It's done when box 2 is positioned outside of the upper-right corner of square 2 using absolute positioning.

  • It's done when the finished page matches the mockup.

Assets

The following image demonstrates the web application's appearance and functionality:

Box 2 is positioned in the center of Square 1, while in Square 2, Box 2 is positioned outside the square.

💡 Hints

How does the CSS position property change the document's normal flow?

🏆 Bonus

If you have completed this activity, work through the following challenge with your partner to further your knowledge:

  • What is the z-index property?

Use Google or another search engine to research this.

© 2021 Trilogy Education Services, LLC, a 2U, Inc. brand. Confidential and Proprietary. All Rights Reserved.