css - 媒体查询在 chrome 中工作,但在 Firefox 中不工作
问题描述
我为 chrome 编写了一个媒体查询,它在 Firefox 中无法正常工作。
我正在尝试1366*768
屏幕分辨率。
我附上了 Chrome 的工作截图和 Firefox 的工作截图。
HTML:
<div class="row m-row--no-padding m-row--col-separator-xl">
<div class="my-widget-gridster">
<!-- Widget Gridster-->
<gridster *ngIf="data.length>0" [options]="options">
<gridster-item [item]="item" [ngClass]="{ 'gridster-item-maximize': item.pod.podMaximized }" *ngFor="let item of data; let i= index;" (contextmenu)="onPodContextMenu($event, item); $event.preventDefault()" >
<e-pod [type]="type" [refreshCount]="count" [iPodModel]="item.pod" [index]="i" (widgetMinMaxEmit)="onPodMaximize($event, item, i)"></e-pod>
</gridster-item>
</gridster>
</div>
</div>
CSS:
@media screen and (min-width: 1366px) and (max-height: 768px) {
.gridster-item-maximize {
transform: translate3d(0px, 0px, 0px);
display: block;
z-index: 9999;
position: fixed;
width: 74.6% !important;
height: 78.8% !important;
top: 20.6%;
left: 24.9%;
bottom: 0;
overflow: auto;
}
}
预期:为 Chrome 编写的媒体查询应该适用于所有浏览器。
实际:适用于 chrome,而不是 Firefox。
铬合金:
火狐:
解决方案
推荐阅读
- excel - 关于无效限定符的 Excel VBA 的问题
- sql - 如何通过公共列名在 BigQuery 中加入三个表
- c++ - 是否可以在不使用变量(临时保存数据)的情况下读取文件
- pytorch - 考虑到 torchaudio 中的变换,是音频帧或毫秒中的窗口长度等
- python - 如何在 Anaconda 中使用 Python2 安装 Spyder
- python - 为什么 `types.coroutine` 不产生协程?
- javascript - 限制 sharepoint 中的某些搜索关键字
- python - 在具有相同日期的行上将列从一个数据帧复制到另一个数据帧
- flutter - Flutter应用程序打开时如何从sqlite数据库加载初始状态数据
- java - 底部导航不起作用,但正在为其他活动工作