css 在网页上定位三个按钮

bvk5enib 于 2023-03-25 发布在其他

关注(0)|答案(2)|浏览(124)

我的网页上有三个按钮。我想把两个按钮放在网页的最右边和最左边的角落，一个放在中间。我试过这个CSS，但管理层想把按钮移到更右边和更左边：

.buttons-flex {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}

所以我把CSS改成这样：

.left-btn {
    float: left;
}

.right-btn {
    float: right;
}

.center {
    display: flex;
    justify-content: center;
    align-items: center;
   
  
}

使用上面的css，按钮没有正确对齐，也没有足够的空间。2下面是按钮的屏幕截图：

我想下载按钮的右边缘与上述黑色线对齐

css

来源：https://stackoverflow.com/questions/75807241/positioning-three-buttons-on-the-web-page

2条答案

按热度按时间

vfh0ocws1#

这就是你要找的吗？

#button-container {
  display: flex;
  justify-content: space-between;
}

<div id="button-container">
  <button>Button1</button>
  <button>Button2</button>
  <button>Button3</button>
</div>

赞(0）回复(0）举报 2023-03-25

dfty9e192#

.container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.button {
  width: 100px;
  height: 40px;
}

.button-left {
  margin-right: auto;
}

.button-right {
  margin-left: auto;
}

容器包含所有的按钮，而button-right和button-left会将按钮推到容器的最远位置

赞(0）回复(0）举报 2023-03-25

我来回答

css 在网页上定位三个按钮

2条答案

相关问题

热门标签

最新问答