i want to put the div above the image, but i don't know why it is always under it event if i set the z-index attribute
my code likes:
<main id="content" role="main">
<div style="text-align: center">
<img src="assets/header-img.jpg" style="z-index: -1;">
</div>
<div class="container" style="background-color: bisque; height: 1000px; margin-top: -680px"></div>
</main>there are two questions:
Use relative positioning to be able to use z-index. Then you can use top as well which is a bit more robust than negative margins in my experience.
Default positioning is static which does not honour z-index.
<main id="content" role="main">
<div style="text-align: center">
<img src="assets/header-img.jpg" style="position: relative; z-index: 0;">
</div>
<div class="container" style="background-color: bisque; height: 1000px; position: relative; top: -680px; z-index: 1"></div>
</main>Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments