我似乎根本无法移动按钮。我试着在我能想到的每一个地方使用顶部、顶部边距和填充来调整它们的位置。没有任何东西能让它们移动。我试着调整容器和按钮组的flex属性,但每当我这样做时,所有东西都在移动。
我想将按钮组放置在右中的option 2-text(视频名称)下方。
以下是我一直关注的部分:
.container {
max-width: 1000px;
margin: 0 auto;
display: flex;
flex-direction: column;
align-items: flex-end;
height: 200px;
}
.button-group {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
z-index: 2;
position: absolute;
height: 200px;
}
.higher-btn,
.lower-btn {
padding: 10px 20px;
background-color: #000;
border-radius: 100px;
border: 2px solid #fff;
font-size: 1.2em;
margin-top: 10px;
color: #fff;
cursor: pointer;
z-index: 1;
}
<div class="container">
<div id="button-group">
<button class="higher-btn">Higher</button>
<button class="lower-btn">Lower</button>
</div>
</div>
我不知道如何移动按钮元素。
2条答案
按热度按时间roejwanj1#
“."用于类选择器,”#“用于ID选择器。
此代码选择器替换为“#”。
示例:
lawou6xi2#
将
.button-group
更改为#button-group
,因为“."用于类选择器,”#“用于ID选择器。请注意,id
必须是唯一的每个文档-您不能在一页中多次使用任何给定的ID。