[英]How to remove space (margin/padding) of ion-row and ion-col in ionic?
Here is my code:这是我的代码:
<ion-content padding text-center>
<img src="../assets/img/logo.png" width="200" class="logo" />
</ion-content>
<ion-footer>
<ion-row no-padding>
<ion-col col-6 align-self-stretch>
<button ion-button full>Button</button>
</ion-col>
<ion-col col-6 align-self-stretch>
<button ion-button full>Button</button>
</ion-col>
</ion-row>
</ion-footer>
I need to remove those paddings/margin for ion-row and ion-col.我需要删除 ion-row 和 ion-col 的那些填充/边距。 I tried googling but i got no luck.
我试过谷歌搜索,但我没有运气。 I am also newbie in Ionic.
我也是 Ionic 的新手。 TIA!
蒂亚!
Here is the screenshot:这是屏幕截图:
I need to achieve this:我需要实现这一点:
You need to set the no-padding
attribute on ion-col instead of ion-row and no-margin
for the buttons.您需要在 ion-col 上设置
no-padding
属性,而不是为按钮设置 ion-row 和no-margin
。
<ion-row>
<ion-col col-6 no-padding>
<button ion-button full no-margin>Button</button>
</ion-col>
<ion-col col-6 no-padding>
<button ion-button full no-margin>Button</button>
</ion-col>
</ion-row>
For those using Ionic4+ , use class="ion-no-padding"
or class="ion-no-margin"
.对于那些使用 Ionic4+ 的人,请使用
class="ion-no-padding"
或class="ion-no-margin"
。
...
<ion-col class="ion-no-padding">
<ion-button class="ion-no-margin">Button</ion-button>
</ion-col>
...
For more info please refer to the docs: https://ionicframework.com/docs/layout/css-utilities#element-padding .有关更多信息,请参阅文档: https : //ionicframework.com/docs/layout/css-utilities#element-padding 。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.