离子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的。