Question

嘿我怎么能移动页面底部的两个按钮（底部对齐，底部和按钮之间没有空格） Thx提前

HTML

<ion-content class="background">

       <button ion-button full color="primary"> LOGIN </button>
       <button ion-button full color="danger"> REGISTER </button>


    </ion-content>

SCSS

page-home {


     .background{
        background-color: #66CC81;
}

.button{
    margin: 0px;

    margin-bottom: 0px;
    margin-block-end: 0px;

}


}

enter image description here

Answer 1

我认为如果你使用ion-footer，你可能会更好。在结束</ion-content>代码

之后添加此内容

<ion-footer>
  <ion-toolbar>
       <button ion-button full color="primary"> LOGIN </button>
       <button ion-button full color="danger"> REGISTER </button>
  </ion-toolbar>
</ion-footer>

Answer 2

您可以使用以下CSS样式规则：

.button{
    text-align: bottom; 
    position : relative; 
    top: 5px; 
    left: 10px;
    right:20px;
}

Answer 3

添加

位置：绝对;

To .button class。

如何移动底部的2个按钮？

3 个答案: