我只想要按钮是拥抱的权利与短信是直接在它下面。
我怎么能做这种事？
这是我的CSS文件，负责按钮:
.navButton{
text-decoration: none;
margin-top: 20px;
margin-right: 15px;
margin-bottom: 20px;
padding: 14px 28px;
float: right;
background: rgb(206, 0, 178);
border: 0px;
color: rgb(255, 255, 255);
font-size: 18px;
font-weight: 400;
border-radius: 20px;
-webkit-transition:.5s;
}
不看到HTML确实很难，但是尝试将以下代码添加到包含两个按钮的元素中。
我猜是有.navbutton类的，所以:
.navButton {
display: flex;
justify-content: flex-end;
}
最好在您的代码片段中添加HTML5标记！ 这里我添加CSS，基于你的风格。
.navButton{
text-decoration: none;
margin-top: 20px;
margin-right: 15px;
margin-bottom: 20px;
padding: 14px 28px;
display:flex;
justify-content:flex-end;
background: rgb(206, 0, 178);
border: 0px;
color: rgb(255, 255, 255);
font-size: 18px;
font-weight: 400;
border-radius: 20px;
-webkit-transition:.5s;
}
假设HTML标记如下所示:
<header>
<h1>Logo</h1>
...
<div class="actions">
<div class="buttons">
<button>About</button>
<button>Logout</button>
</div>
<p>OneClickTest</p>
</div>
</header>
您可以使用flexbox将.buttons和标记堆叠在.actions内。
下面是代码en:https://codepen.io/lksmthm/pen/growpgb
其思想是这样的，按钮+标记的共享父级将flex-direction设置为column，以便.buttons和垂直堆叠，我们还将align-items:flex-end设置为右对齐所有内容。
在代码Pen中，我再次在.buttons上使用flexbox，但使用flex-direction:row将按钮水平放置。
很抱歉，如果这有点让人困惑--无论如何，发送一些HTML和更详细的CSS片段，我可以将其具体地定向到您的项目中:）
