イオンアイコンの右揃え

Question

イオンアイコンをデフォルトで右揃えしたいのですが、左側に表示されています。これどうやってするの？誰か助けてくれますか？

<div class="bar bar-footer no-line "> 
    <i class="icon ion-ios-navigate-outline icon"></i> 
    <i class="icon ion-document-text icon "></i> 
</div> 

Answer 1

.barだからjustify-content: flex-end;はあなたのために働く必要がありionic.css
につきとしてdisplay:flex性質を持っているためです。

bar-footerには、フレックスライトクラスiが追加されています。

は、次のコードを参照してください：

.flex-right { 
 
    justify-content: flex-end; 
 
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/ionic/1.3.2/css/ionic.min.css" rel="stylesheet" /> 
 
<div class="bar bar-footer no-line flex-right"> 
 
    <i class="icon ion-ios-navigate-outline icon"></i> 
 
    <i class="icon ion-document-text icon"></i> 
 
</div>