Image over a image

I want my edit icon to appear just below the profile pic image as shown in the below image download

But I’m getting as

The code is from html file

<div id="ppic">
          <img src="assets/imgs/pp.jpeg" id="pic"> 
                <button ion-button clear >
                    <img src="assets/imgs/edit-icon.png" id="imgedit">
          <p id="name">M S</p>
          <p id="loc">Markham , ON</p>

Scss code

#ppic {
       // position: absolute;
        padding-top: 40px;
        width: 90px;
        height: 90px;
        display: block;
        margin-left: auto;
        margin-right: auto;
    #pic {
        border-radius: 50%;
    #imgedit {
        position: absolute;
        //z-index: inherit;
        top: 10px; 

can someone help me?