html控件重叠在一起,html - 如何解决3个重叠的按钮？ - 堆栈内存溢出

我有3个下拉按钮，在移动视图上而不是水平显示，它们彼此重叠。 我认为.filter-check:checked+label类属性需要进行审查。 我可以对代码进行哪些更改，以便水平显示按钮？

这是我的scss代码

@media (min-width: 700px) {

.filter-button {

display: none;

}

.filter-check {

display: none;

}

}

@media (max-width: 700px) {

.filter {

display: none;

}

.filter-check {

display: none;

}

}

@media screen and (max-width: 700px) {

.filter-button {

background: white;

border: 1px solid black;

border-radius: 2px;

color: dark-gray;

float: right;

font-family: font-family-nimbus-sans-bold;

font-size: 18px;

height: 48px;

text-align: left;

width: 100%;

}

}

// sass-lint:di