i want to achieve below layout in my ionic app
so below is my code
html code
<div class="common_padding">
<ion-item text-center class="imagebg" no-padding (click)="openCameraActionSheet()">
<img class="circle-pic" src="{{client.logo}}" style="height: 100px; width: 100px" />
<ion-icon name="star" item-right></ion-icon>
</ion-item>
css code
page-profile {
.imagebg{
background: map-get($colors,primary);
color: map-get($colors,whiteColor);
}
.common_padding{
padding: 0;
}
.circle-pic{
width:50px;
height:50px;
-webkit-border-radius: 50%;
border-radius: 50%;
}
}
And when i run above code i get output as below
it display right end of view i need it near to image any idea how can i solve this ?
html file
<div class="common_padding">
<ion-item text-center class="imagebg" no-padding (click)="openCameraActionSheet()">
<div class="profile-image">
<img class="circle-pic" src="{{client.logo}}" style="height: 100px; width: 100px" />
<ion-icon name="star" item-right></ion-icon>
</div>
</ion-item>
</div>
css file
.profile-image{
margin:0px auto;
}
i hope its work for you.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.