为什么浮动按钮不能保持它们的位置？
提问于 2017-04-16 06:46:21
在片段中，您可以看到，如果我想通过浮动按钮/组，它们不能保持相对段的位置。我的布局有什么问题？代码清单u可以看到放置在段中的标题的https://codepen.io/saveurmind/pen/oWXWOa内容，我在raw中使用全尺寸列(16)。如果我使用的按钮没有“右浮动”-一切都好。
<div class="row">
<div class="sixteen wide column">
<div class="header-bar">
<div class="ui segment">
<div class="header-content">
<h3 class="ui header">Title</h3>
<div class="ui right floated basic buttons">
<div class="ui button">One</div>
<div class="ui button">Two</div>
<div class="ui button">Three</div>
</div>
</div>
</div>
</div>
</div>
</div>
回答 1
Stack Overflow用户
回答已采纳
发布于 2017-04-16 07:02:11
可以使用“清除”将子元素包含在父块中。
.clearfix:after {
content: " "; /* Older browser do not support empty content */
visibility: hidden;
display: block;
height: 0;
clear: both;
}如果您希望标题与btn行相同，那么有两种方法：
- 将h3改为span (cus h1~h6将占据整条线)
https://codepen.io/hdl881127/pen/bWdRVp
- 如果要保留h3，则需要添加一个名为
https://codepen.io/hdl881127/pen/BRNZLj
.inlineblock{
display:inline-block;
}有关清除的更多信息，您可以在这里阅读：
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/43438432
复制相关文章
点击加载更多
腾讯云开发者
