Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Aprende Challenge: Control Z-Index and Overlapping Element | Mastering CSS Positioning
Advanced CSS Techniques
course content

Contenido del Curso

Advanced CSS Techniques

Advanced CSS Techniques

1. Getting Started with Advanced CSS
2. Mastering CSS Positioning
3. Creating Smooth Transitions in CSS
4. Advanced CSS Animations
5. Transforming Elements with CSS
6. Responsive Web Design in CSS
7. CSS Preprocessors and Sass

book
Challenge: Control Z-Index and Overlapping Element

Task

Create a visually appealing background for the website using an illustration composed of 5 different images. All images are correctly positioned within the frame of the parent div element. Your task is to adjust the stacking order using the z-index property to achieve the desired view outlined in the image below:

html

index.html

css

index.css

copy

To change the stacking order of the images within the parent div element, use the z-index property. A higher z-index value, such as 1, raises the element above others in the stacking context, making it visible in the foreground.

html

index.html

css

index.css

copy

¿Todo estuvo claro?

¿Cómo podemos mejorarlo?

¡Gracias por tus comentarios!

Sección 2. Capítulo 11
We're sorry to hear that something went wrong. What happened?
some-alt