DIV中的按钮位置

时间:2018-08-07 21:35:15

标签: button css-position

10年后,我回到了html&css编码,并且发生了很多变化。我感觉就像《黑镜》世界中的弗雷德·弗林斯通。

所以我可能有一个愚蠢的问题-如何将按钮放置在div的中间。我的意思是我在CSS中以文本对齐的中心。但水平方向仍处于顶部边界。在下面的Ss中,我只是在PS中制作了div的边框以显示其构建方式。它还具有响应性,因此在使用电话时,带有按钮的行位于带有文本的行的上方。

Picture in here

  .ghost-button {
  display: inline-block;
  padding: 15px 30px;
  color: #fffff;
  font-family: Inconsolata, monospace;
  letter-spacing: 3px;
  margin: 15px; 
  border-radius: 15px;
  border: 2px solid #fff;
  text-align: center;
  outline: none;
  text-decoration: none;
  transition: background-color 0.2s ease-out,
              color 0.2s ease-out;
}

1 个答案:

答案 0 :(得分:0)

请尝试使用以下代码段

.ghost-button {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
  margin: auto;
}

谢谢!