简体   繁体   中英

Logout button not moving to right side in ionic app

This is my setting Page

 <ion-header>
      <ion-toolbar>
    
       <ion-title>Settings</ion-title>
    
      <ion-row>
      <ion-item>
        <ion-button (click)="logoutAction()"  float-right>Log Out.</ion-button>
      </ion-item>
      </ion-row>
      </ion-toolbar>          
     
    </ion-header>
             
    <ion-content>
     
        ..other code
     
    </ion-content>

This looks like below

在此处输入图像描述

I need to float right in settings header. Is it possible to move right side..pls help

I would have tried this to use slot .

<ion-toolbar>
    <ion-title>Settings<ion-title>
    <ion-item>
        <ion-button (click)="logoutAction()" slot="end">Log Out.</ion-button>
    </ion-item>
</ion-toolbar>

Will output

SETTINGS
                                    LOG OUT.

if you don't want a line in between, you can skip the ion-item .

<ion-toolbar>
    <ion-title>Settings<ion-title>
    <ion-button (click)="logoutAction()" slot="end">Log Out.</ion-button>
</ion-toolbar>

Will output

SETTINGS                            LOG OUT.

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.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM