css - 为什么我不能调整按钮宽度并将它们并排放置在@media 中

Question

我在主页上有两个按钮。

正确的选择器是

.btn

我只想将这两个并排放置，并且移动 View 的尺寸要小一些。

尝试过:

@media (max-width: 400px) {
    .btn {
        display: inline-block; 
        height: 10px; 
        width: 10px;
    }
} 

高度改变了，没有其他改变，按钮在同一个地方保持在彼此之上。

尝试过:

@media (max-width: 400px) {
    .btn {
        display: block; 
        float: left; 
        height: 10px; 
        width: 10px;
    }
} 

按钮高度减半，宽度保持不变，并且不是并排，而是彼此重叠。

尝试使用相同的代码:

@media screen and 

没有

实时网址:https://adsler.co.uk/

Answer 1

使用实时 URL 更新了问题。

这应该是你想要的。

@media (max-width: 400px) {
    .btn { 
        display: inline-block; 
        height: 28px; 
        font-size: 12px; 
        width: 151px; 
        min-width: 80px; 
        padding: 0; 
    }
}