Z-Index CSS Tutorial

In this tutorial we learn what the z-index property is used for. Check out my premium 9 hour web design video course:

Have you created amazing pages with HTML & CSS and want to move them from your computer’s hard drive to online so the world can see them? The next step is to move your files to a web host. Learn about web hosts, my favorite hosting company, and how to save $40 on the only hosting plan you’ll need:

Sign up for my newsletter to receive periodic webDev tips, tricks, resources and coupons. Join the list at

Follow LearnWebCode on Twitter for resources and updates:






45 responses to “Z-Index CSS Tutorial”

  1. fayysal asghar Avatar

    Thank u so much.Awesome video 🙂

  2. Andy Dry Avatar

    Awesome tutorial my friend!! Very clear and straight to the point thank you 🙂

  3. Drummer Place Avatar

    Thanks bro u are talented teacher!!! Best video on youtube!!!

  4. LeNard Simmons Avatar

    I'm sure not too much about z-index has changed over the years, therefore the information is still relative in this tutorial. Months of trying to understand how to use a z-index and the values, all cleared up in only 7 minutes.

    Thank you. I subscribed with notification.

  5. Sophea Soeng Avatar

    Thank you for sharing

  6. César Zavala Varón Avatar

    Great video!!! Thank you so much 😀

  7. Rupesh Vaingankar Avatar

    wow.. awesome.. vry easy to learn tutorial.. lov it manh.. Thanks alot.. 🙂

  8. Joan Montoya Moyá Avatar

    Wonderful explanation!! I've been struggling for one hour with a related issue, and after watching your video I solved it in 1 minute 🙂

  9. Alex Bradley Avatar

    thank you, very helpful.

  10. Bobosa Avatar

    what application is he using to write these codes?

  11. Blake Paige Avatar

    Thank you the video help me

  12. ahmed abdelatif Avatar

    Thank you, Professor… 🙂

  13. gaurav28ch Avatar

    Thank you. Very nicely explained !!

  14. Neil Gaming Avatar

    stop my movie marathon and I will marathon all of your videos instead. Thanks!

  15. T Thrasher Avatar

    Just for clarity: if the z-index of the orange is lower than the z-index of the red, it would be behind the red, correct? I'm assuming the fact that it is a child does not affect whether or not it can be placed in front or behind its parent.

  16. Joseph Oenix Avatar

    Hey, see if this is doable with your expertise. I have a one page website, only contains two elements, a video, an image, same size. I want the video starts play, when it finishes playing, it fades out to show the image beneath. Asked many people, so far can't make it work.

  17. Abi Avatar

    I solved my problem in a few minutes after trailing through the internet … thank you!

  18. Dust-Bin Laden Avatar

    I'm guessing this worked for everyone apart from 1 person because of the amount of likes and dislikes..

  19. Prashant Sharma Avatar

    thank you, it was simple and smart, very helpful.

  20. Mamunur Rashid Avatar

    Great tutorials………

  21. Periklis Paschidis Avatar

    Very simple, and yet, VERY helpful! Thanks for making this video and sharing it with us.

  22. Traissy Avatar

    I have to say thank you… I was struggling on a project I'm working on… I was leaving the "relative" part out of the equation. Thanks!!!

  23. Husain Ahmmed Avatar

    Thanks for this awesome tutorial.

  24. Justin Munce Avatar

    How can one place a relative/absolute atop a fixed?

    I am attempting this right now.

    Thanks, Justin

  25. Muneeb Ahsan Avatar

    Awesome explanation

  26. TheRoxas13th Avatar

    I love the speed of the explanation. Slow and clear. 

  27. Harry Avatar

    This is the best video I've found, literally helped me in the first 3 minutes 🙂 Liked!

  28. Hacka Slash Avatar

    Thanks for this video..!

  29. Vivek Jha Avatar

    Very clear and explanatory tutorial on z-index topic

  30. Jake Ambrose Avatar

    great teaching vid clear efficient and you speak clear and fast enough. its perfect well done.

  31. Sarah Weir Avatar

    There's an MIT research experiment that's looking to improve the way people learn from tutorial videos– if you check out their site http://crowdy.csail.mit.edu/play/35/, you can watch this same video but with some added features. It's free and definitely worth checking out!

  32. Michael Benjamin Avatar

    great explanation. thanks.

  33. Amal Babu Avatar

    Thanks for the tutorial.

  34. zrebrutibreniti Avatar


  35. dilexman1 Avatar

    Thanks bro !
    make some more…

  36. Sylinic Avatar

    Dude yes! Just found you, make more vidyas!

  37. Ziyo Shams Avatar

    Well explained !!! How about more videos?

Leave a Reply

Your email address will not be published. Required fields are marked *