如何在CSS样式表中从固定宽度到百分比宽度？

Question

如果我将视口大小调整为640像素或更小，我希望div能够响应并将自身调整为100％的屏幕宽度。所以我写了这个CSS

div.mypanel {
    position: absolute;
    top: 0;
    right: 0;
    min-height: 100%;
    width: 570px;
    z-index: 3;
    margin: 0;
    overflow-x: hidden;
    border-radius: 10px 0px 0px 10px;
    border: 1px solid #00295E;
}
@media screen and (max-width : 640px;) { div.mypanel { width : 100%; } }

唯一的问题是......除非将div.mypanel设置为百分比宽度，并且我不想要百分比，否则它似乎无效。

一些模糊的CSS定义是不允许的？

Answer 1

它无法正常工作，因为您的id后面有Activity，这不是媒体查询的正确语法。删除它，它应该按预期工作。

JSFiddle