css - 不向右移动

Question

我需要将 + 按钮移到右侧。但是下面的代码不起作用。你能告诉我为什么吗？

.scss

 .plusButton {
        position: absolute;
        z-index: 11;
        color: white;
        float: right;
    }

.html

<button ion-button clear class="plusButton"> <ion-icon name="add-circle"></ion-icon></button>

Answer 1

这个怎么样:

.plusButton { 
  position: absolute; 
  z-index: 11; 
  color:white; 
  top: 16px; 
  right: 16px; 
}

请注意 top和 right值。 Ionic 通常在内容中使用 16px 的填充(当您将 padding 属性添加到内容 <ion-content padding>... 时，当我需要在 Ionic 之外做一些事情时，我总是使用相同的填充。

另请注意，如果按钮位于 navbar 中, 我建议使用 <ion-buttons end>...<ion-buttons>容器将其放在右侧，但在这种情况下按钮似乎不是 navbar 的一部分/toolbar ，所以我想我们可以通过使用 css 来修复它。