CSS失败了

Question

我想使用媒体查询调整列宽，但我无法这样，我需要专家建议，如果你愿意，我可以向你展示整个代码。问题出现在我的.cities类和.cities .col中，我无法改变宽度，字体大小，图标大小。 什么都没有。

谢谢

CSS代码：

 @media only screen and (max-width:767) and (orientation:landscape) {
        /* Styles for Landscape screen */
        header {
            height: 200vh;
        }
        header nav li a {
            font-size: 85%;
        }
        .cities .col {
            display: block;
            width: 100%;
        }
        .cities h3 {
            font-size: 10%;
        }
        .ios-small {
            font-size: 100%;
        }
        .cities .col img {
            width: 100%
        }
        .cities {
            padding: 0px;
        }
        .cities .col {
            margin-top: 5%;
            padding-bottom: 2%;
            width: 100%;
            transition: width 0.3s;
        }
        .cities .col:hover {
            background: rgba(234, 234, 234, 0.9);
            color: black;
        }
        .cities .col img {
            width: 100%;
            height: auto;
            margin: 0 0 0 0px;
        }
        .cities h3 {
            text-align: left;
            margin: -4px 0 0 0px;
            font-size: 100%;
        }
        .ios-small {
            font-size: 20%;
            font-weight: 200;
            margin-right: 5px;
            font-style: italic;
            color: #e67e22;
        }
    }

This is the Preview of Website in Iphone6 Landscape

Answer 1

您需要为断点添加一个单位max-width:767px。