css - 我的 CSS 代码有什么问题

Question

我的 CSS 代码需要一些帮助。我的 col 的颜色没有显示出来。当我删除某行时，它会起作用。

@-ms-viewport{
width: device-width;
#result { font-weight: bold; text-align: center; }
#result .error { padding: 4px; background: #ffebe8; border: 1px #eb8a71 solid; }
#result .message { padding: 4px; background: #e8ffec; border: 1px #79ef9d solid; }

#result #grid { width: 50%; margin: 10px 0 0; }
#result #grid .even { background-color: #fff; }
#result #grid .odd { background-color: #F0F0F6; }
#result #grid .highlight { background-color: #3D3D3D; font-weight: bold; }
#result #grid .header { background: url(../images/small.gif) no-repeat #E6EEEE right center; cursor: pointer; padding: 4px; }
#result #grid .headerSortUp { background: url(../images/small_asc.gif) no-repeat #8DBDD8 right center; }
#result #grid .headerSortDown { background: url(../images/small_desc.gif) no-repeat #8DBDD8 right center; }
#result #grid .col1, #grid .col2, #grid .col3 {  }
#result #grid .col1 { width: 15%; }
#result #grid .col2 { width: 20%; }
#result #grid .col3 { width: 10%; }
#result #grid .col1 img { display: block; padding: 4px; margin: 4px 0; border: 1px #efefef solid; }
}

当我删除这一行时:

@-ms-viewport{
width: device-width;

它可以工作，但是网站没有响应。谁能帮我解决这个问题。我真的需要解决这个问题。

Answer 1

我猜您正在为 Microsoft Internet Explorer 定义视口(viewport)，并且正在其他浏览器(例如 chrome/firefox/mozilla)上进行测试。

如果是这种情况，只需添加必要的视口(viewport)即可:

@-webkit-viewport
@-moz-viewport
@-o-viewport