表显示块不是媒体查询工作

Question

我有一个表，这里是我的CSS：

table { 
display: block; 
height: 500px; 
overflow-y: scroll; 
} 

当我加入这个内嵌它是确定，但在外部不工作（在媒体查询最大宽度767px）

编辑|我的媒体查询

@media(max-width:767px) { 
table { 
    display: block; 
    height: 500px; 
    overflow-y: scroll; 
} 
} 

Answer 1

尝试将您的表放入div包装中。像这样：

<div class='table-container'> 
    <table></table> 
</div> 

然后在你的CSS简单的设置

.table-container > table { 
    height:100%; 
    width: 100%; 
} 

.table-container { 
    height: 500px; 
} 

看到这个fiddle