- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在尝试使我的 div main.wrapper
适合视口(viewport)高度,并带有溢出。它适用于 Safari 和 Google Chrome,但是当使用 IE 或 Edge 打开并调整到较小的高度时,会出现错误。
有没有办法解决这个问题并防止正确的内容超过 100% 高度? Bootstrap有没有这个功能,用起来会更方便吗?
最佳答案
使用 flexbox 怎么样?
html, body, .app, .left-pane, .right-pane {
width: 100%;
height: 100%;
}
.row, .col {
margin: 0 !important;
padding: 0 !important;
}
.left-pane {
background: green;
display: flex;
flex-direction: column;
}
.right-pane {
background: pink;
display: flex;
flex-direction: column;
}
.right-pane main {
flex: 1;
overflow-y: auto;
}
.right-pane main .wrapper {
height: 100%;
}
.right-pane main .wrapper {
overflow: auto;
}
header {
flex: 0 1 50px;
max-height: 50px;
background: blue;
}
footer {
flex: 0 1 50px;
max-height: 50px;
background: yellow;
}
<link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/css/materialize.min.css" rel="stylesheet"/>
<div class="row app">
<div class="col s4 left-pane">
<header>header left</header>
body left
</div>
<div class="col s8 right-pane">
<header>header right</header>
<main>
<div class="wrapper">
<p>main</p>
<p>main 2</p>
<p>main 3</p>
<p>main 4</p>
<p>main 5</p>
<p>main 6</p>
<p>main 7</p>
<p>main 8</p>
<p>main 9</p>
<p>main 10</p>
</div>
</main>
<footer>footer</footer>
</div>
</div>
关于html - IE 和 Edge 高度 100% bug,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39091851/
我想通过注册表更改 Edge 浏览器中的主页,但它是加密的,我在注册表中看到( protected - 修改违反 Windows 策略。请参阅 aka.ms/browserpolicy)。请帮助我在注
如果我开发一个网站,它是否会以相同的方式在 IE11、Chrome、Firefox 和 edge 上运行,还是我们需要专门为 IE11 编写代码?我没有 Windows 8,因此无法在边缘浏览器上测试
如果我开发一个网站,它是否会以相同的方式在 IE11、Chrome、Firefox 和 edge 上运行,还是我们需要专门为 IE11 编写代码?我没有 Windows 8,因此无法在边缘浏览器上测试
如果 Edge 在某些机器上发生崩溃,我们需要检查日志以了解发生了什么情况。 最佳答案 Microsoft Edge 实际上是一个 Windows 进程,因此您应该能够在事件查看器中查看日志。此外,您
我们公司已将 Chrome 扩展程序移植到 Edge。扩展工作正常,但弹出窗口本身有很多重要内容。如果您在扩展设置中切换“地址栏旁边的显示按钮”,边缘扩展似乎只显示弹出按钮。这通常是一种糟糕的用户体验
我正在尝试在 Microsoft Edge 中调试崩溃的应用程序,但它提供了友好的错误页面: This page is having a problem loading We tried to loa
经过长时间的研究,我创建了我的最佳电子书 (Epub) 阅读器。作为主要设备,我基本上使用 Windows 10 平板电脑和 Microsoft Edge 作为 (Epub) 阅读器。 这是伟大的和惊
如何使用注册表或命令行获取 Microsoft Edge 浏览器版本? 我不想从 UI 中获取它。 最佳答案 对于 Microsoft Edge Legacy ,您可以使用 Get-AppxPacka
是否有可靠的编程方式来确定 Microsoft Edge 是默认浏览器? 我知道一种选择是使用 IApplicationAssociationRegistration::QueryCurrentDef
当人们在 Edge 中浏览网站时,很高兴看到“阅读 View ”按钮已启用。想要了解一个页面如何适合阅读模式。这将有助于开发人员在开发网站时牢记阅读模式。 最佳答案 答案来自 Microsoft Ed
我们在三周前向申请表提交了 Microsoft Edge 扩展:https://aka.ms/extension-request . 我们还没有收到任何反馈,在开发者仪表板中提交扩展包时,我们收到以下
我可以运行 code 从 WSL2 内部启动 VSCode。 我将如何启动 Edge(当前基于 Chromium 的 Edge)? 我试过了: ~/Code/company/workshops-web
最新版本的 Microsoft Edge 浏览器 (41.162...) 在单击后退和前进按钮时请求新页面。我在多个平台上测试了多个浏览器,只有 Edge 表现出这种行为。 这是一个 test pag
我在 Windows 1803 版本 17134.376 中使用 Microsoft Edge。 我有一个在 IIS 中本地运行的 ASP.NET Core 网站。该网站在 Edge 中可以正常打开,
Edge on Desktop 未加载谷歌字体。事实上,它甚至没有使用被定义为回退的“sans-serif”。 此行为不会在 Mobile Edge 中复制。 How it should look l
iotedge logs 暴露的日志在哪里?命令存储? 通常在 Linux 上会在哪里? 最佳答案 只需执行 docker inspect 及以下 LogPath您将获得容器的当前位置。例如。对于
我正在尝试将 Polymer 2 组件集成到现有的 SPA([ab] 使用 JSF 构建)。只要我的 POC 在 Chrome 中运行,我的基础知识就可以正常工作,我真的不在乎它是在 Shadow 还
我们的大型单页 JavaScript 应用程序在 Edge 浏览器中根本无法运行。 (我们在 Chrome 和 Firefox 中正式支持它,我们不允许在 IE 中使用它,因为它只能在那里工作一半,我
Microsoft Edge 16 中存在错误(已多次报告并在此处确认:https://developer.microsoft.com/en-us/microsoft-edge/platform/is
Microsoft Edge 16 中存在错误(已多次报告并在此处确认:https://developer.microsoft.com/en-us/microsoft-edge/platform/is
我是一名优秀的程序员,十分优秀!