Question

如何通过ionic-3中的离子输入消除离子项目中不必要的填充？

<ion-row align-items-center>
   <ion-col col-3></ion-col>
   <ion-col text-right  no-padding col-4.5> 
      Canister Width <p>(C.W.)</p>:
   </ion-col>
   <ion-col no-lines ion-item no-padding>
      <ion-input></ion-input>
   </ion-col>
</ion-row>

Answer 1

您无法从具有标签item的标记中的ion-item删除填充，因为不是ion-item拥有填充，而是item-inner子拥有填充是在内部生成的。

这就是no-padding不起作用的原因，但是您可以使用这样的CSS来简单地做到这一点

.item .item-inner {
  padding-left: 0px;
}

希望这会有所帮助。

Answer 2

尝试这个？

 <ion-row align-items-center no-padding>

或者您可以添加<div no-padding> ？

Answer 3

将以下代码添加到您的CSS

ion-item{padding:0 !important}

或

您可以在HTML文件中添加内联CSS

<ion-row align-items-center>
   <ion-col style="padding:0"> 
      Canister Width <p>(C.W.)</p>:
   </ion-col>
</ion-row>

如何在ionic-3中输入离子来消除离子项目中不必要的填充？

3 个答案: