需要帮助才能找到正确定位按钮的方法
需要帮助才能找到正确定位按钮的方法
提问于 2017-09-20 03:09:25
我目前正在为我的编程课做一个琐碎的游戏。大多数事情都是按预期工作的，但我不知道如何正确定位time按钮。
按钮移出它的空间：琐事游戏按钮错误
这让我有点困惑，因为它在上传到github之前工作得很好。我也无法解决这个错误。
这里是HTML代码，其中包括bootstrap4类：
<div class="col-md-4">
<button type="button" class="btn btn-primary mb-2" id="buttonHit">Start the Game </button>
<button class="btn btn-primary mb-2 float-right noHover">Time: <span class="badge badge-primary" id="time">00:30</span></button>
<div class="list-group" id="list-tab" role="tablist">
<a class="list-group-item list-group-item-action active question" id="question" data-toggle="list" href="#list-home" role="tab" aria-controls="home">Click "Start" to start the game</a>
<a class="list-group-item list-group-item-action answerBtn1 answerBtn" id="answer1" data-toggle="list" href="#list-profile" role="tab" aria-controls="profile"></a>
<a class="list-group-item list-group-item-action answerBtn2 answerBtn" id="answer2" data-toggle="list" href="#list-messages" role="tab" aria-controls="messages"></a>
<a class="list-group-item list-group-item-action answerBtn3 answerBtn" id="answer3" data-toggle="list" href="#list-settings" role="tab" aria-controls="settings"></a>
<a class="list-group-item list-group-item-action answerBtn4 answerBtn" id="answer4" data-toggle="list" href="#list-settings" role="tab" aria-controls="settings"></a>
</div>
</div>我几乎没有使用任何额外的CSS
.noHover{
pointer-events: none;
}
.h1Margin {
margin-bottom: 4rem;
}你可以在github上找到的整个游戏
我很好奇，想知道怎样才能更好地正确定位按钮。
谢谢大家！
回答 2
Stack Overflow用户
发布于 2017-09-20 03:14:56
对于按钮，您可以使用相对位置，然后从上或下(左或右)给出相对位置，以便放置您想放置的任何位置。
Stack Overflow用户
发布于 2017-09-20 03:34:52
它似乎是在做你让它做的事情：
- 容器是
col-md-4 - 时间按钮向右浮动。
我不知道你希望事情看上去如何正确，但你可以通过以下两种方法使它看起来更好：
- 使
#list-tab成为清除的浮动元素(clear: both;) - 通过从时间按钮中移除
float-right类，取消时间按钮的浮动。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/46312627
复制相关文章
相似问题
腾讯云开发者
