Button under images or on the images *ngFor loop - css

Question

From *ngFor loop I can populate images but I want to add a button below the image or on the image. I'm not familiar with CSS below is my code.
Html code
<div class="container">
<div *ngFor="let img of imageData">
<p [hidden]="true">{{img.Id}}</p>
<img class="original" [alt]="img.Name"
src="https://localhost:44349/{{img.ImagePath}}"
width="350" height="350"/>
<button type="submit" (click)="deleteImage()" class="btn btn-danger"><i
class="far fa-trash-alt"></i>
Remove
</button>
</div>
</div>
CSS
.container {
position: relative;
text-align: center;
}
.original {
width: 250px;
height: 250px;
float: left;
margin: 1.66%;
transition-duration: 0.3s;
border-radius: 15px;
}

Answer 1

Hope this is what you are looking for.
.container {
/* position: relative;*/
text-align: center;
display: flex;
flex-direction: column;
}
.original {
width: 250px;
height: 250px;
float: left;
margin: 1.66% auto;
transition-duration: 0.3s;
border-radius: 15px;
}
.content {
display: flex;
flex-direction: column;
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<div class="container">
<div class="content">
<p>Image Id</p>
<img class="original" src="https://www.w3schools.com/bootstrap/cinqueterre.jpg" width="350" height="350" />
<button type="submit" class="btn btn-danger"><i class="far fa-trash-alt"></i>
Remove
</button>
</div>
<div class="content">
<p>Image Id</p>
<img class="original" src="https://www.w3schools.com/bootstrap/cinqueterre.jpg" width="350" height="350" />
<button type="submit" class="btn btn-danger"><i class="far fa-trash-alt"></i>
Remove
</button>
</div>
</div>
For angular with dynamic image your template will be like.
<div class="container">
<div class="content" *ngFor="let img of imageData">
<p [hidden]="true">{{img.Id}}</p>
<img class="original" src="https://localhost:44349/{{img.ImagePath}}" width="350" height="350" />
<button type="submit" class="btn btn-danger"><i class="far fa-trash-alt"></i>
Remove
</button>
</div>
</div>