html - 移动响应 css 不与桌面 css 重叠

Question

我有以下css自定义类

.textblock

在 html 中被调用，我已经为移动设备制作了自定义尺寸，但它仍然采用桌面版本。奇怪的是 td 工作正常，但 text-block 不是。

仅供参考，文本块是在我的表结构中调用的 div 类。

 @media only screen and (min-width: 0px) and (max-width: 700px) {
    td {
        display:inline-block;
        padding:5px;
        width:100%;
    }
    p{
    font-size:2vw;
    }
    .text-block{
    position: absolute;
    left: 25px;
    background-color: transparent;
    color: #101010;
    width: 40%;
    top: 108px;
    }
}
.container {
  position: relative;
  
}

.text-block {
    position: absolute;
    bottom: 77px;
    left: 40px;
    background-color: transparent;
    color: #101010;
    padding-left: 40px;
    width: 40%;

}
}

标签： htmlcss