離子3角度搞砸頁面佈局

Question

我已經完成了離子3中的許多頁面，但是這個特殊的內容已經超出了我的理解。沒有應用css。只是所有平原的離子成分。 它看起來像：

<ion-content> 
<form [formGroup]="settings" (ngSubmit)="saveSettings()"> 
    <ion-list no-lines padding> 
     <ion-item> 
     <ion-input type="text" formControlName="chatHost" placeholder="chat server url"></ion-input> 
     </ion-item> 
     <ion-item > 
      <ion-input type="text" formControlName="channelId" [disabled]="useGse == true" placeholder="channel id"></ion-input> 
     </ion-item> 

     <button ion-button type="submit" class="settings-button" [disabled]="settings.controls['chatHost'].value === ''" full>Save</button> 
    </ion-list> 
    </form> 
</ion-content> 

和外觀： https://www.dropbox.com/s/wusu10ngxukt13n/Screenshot%202017-07-28%2019.47.36.png?dl=0

Answer 1

把重複br的該按鈕的ion-list之外。這可能會產生影響。作爲一個側面說明，我會建議使用CSS來創建按鈕上方的空格，而不是br的。