Skip to content
hands-on lab

Positioning HTML Elements using CSS

Advanced
Up to 30m
134
5/5
Start lab
Get guided in a real environmentPractice with a step-by-step scenario in a real, provisioned environment.
Learn and validateUse validations to check your solutions every step of the way.
See resultsTrack your knowledge and monitor your progress.

Description

Cascading Style Sheets (CSS) allow you to customize the default positioning of HTML elements on a web page.

In this lab, you will position HTML elements in various ways.

Learning Objectives

Upon completion of this beginner level lab, you will be able to use:

  • Relative positioning
  • Fixed positioning
  • Absolute positioning

Intended Audience

  • Beginners learning front-end development
  • Software Engineers who need to learn front-end technologies to expand their skillset

Prerequisites

Familiarity with the following will be beneficial but is not required:

  • Cascading Style Sheets (CSS)
  • Hypertext Markup Language (HTML)

The following content can be used to fulfill the prerequisite:

Updates

July 24, 2024 - Resolved an issue preventing the development interface from appearing

About the author

Avatar
Andrew Burchill, opens in a new tab
Labs Developer
Students
68,469
Labs
170
Courses
2
Learning paths
4

Andrew is a Labs Developer with previous experience in the Internet Service Provider, Audio Streaming, and CryptoCurrency industries. He has also been a DevOps Engineer and enjoys working with CI/CD and Kubernetes.

He holds multiple AWS certifications including Solutions Architect Associate and Professional.

Covered topics

Development
CSS

Lab steps

Introduction to HTML and CSS Labs
Using Relative Positioning
Using Fixed Positioning
Using Absolute Positioning

Lab Rules