Select the img tag with a className and put the following css to it. You can put the width inline also but i prefer to do it this way using className
xxxxxxxxxx
.center {
display: block;
margin-left: auto;
margin-right: auto;
width: 50%;
}
xxxxxxxxxx
body {
margin: 0;
}
#over img {
margin-left: auto;
margin-right: auto;
display: block;
}
xxxxxxxxxx
img {
display: block;
margin-left: auto;
margin-right: auto;
width: 40%;
}
xxxxxxxxxx
<div class="col-md-2" id="newSupps"><label style="color:black; width: 100%; text-align:center">
<img [src]="imgSource" id="newSuppsItem" height="100" width="150"><label style="color:black; width:100%; text-align:center">Centered Image</label></label>
</div>
//css
#newSupps {
background-color: whitesmoke;
height: 100%;
margin-right: 15px;
border-radius: 20px;
padding-top: 5px;
overflow: hidden;
}
#imgCenter{
border-radius: 10px;
width: 80%;
margin-bottom: 5px;
}
#newSuppsItem:hover {
cursor: pointer;
}