[英]ionic css issue while set ion-icon at bottom right to image
我想在離子應用程序中實現以下布局
所以下面是我的代碼
HTML代碼
<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代碼
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%;
}
}
當我運行上面的代碼時,我得到如下輸出
它顯示右視圖,我需要它來成像任何想法我該如何解決呢?
html文件
<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文件
.profile-image{
margin:0px auto;
}
我希望它對您有用。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.