0

I'm trying to place #user_change_photo on top of #user_pic, tried with z-index, but it doesn't work.

HTML

<div id="user_pic"><span><img id="pic" src=""></span></div>
<div id="user_change_photo">Change Photo</div>

CSS

<style>
#pic{
    background-color: orange;
    width:320px;
    height:258px;
    z-index: -1;
}
#user_pic{
    z-index: -1;

}
#user_change_photo{
    width:920px;
    background-color: red;
    color:black;
    margin-top: -50px;
    z-index: 1;

}
</style>
RyanS
  • 627
  • 1
  • 10
  • 26
Junjie Zhang
  • 123
  • 2
  • 6

1 Answers1

0

Add position:relative; for each selector with the z-index style

Alon Eitan
  • 11,997
  • 8
  • 49
  • 58