在ie11中隐藏滚动条和svg高度问题
Hide scrollbar and svg height issue in ie11
我的网页页脚中有 svg 徽标,它们在 firefox 和 chrome 中工作正常,但 ie11 显示 svg 的最大高度而不考虑我给的 witdh 的纵横比svg 在 css.
<div id="footer">
<div id="logos">
<div id="intel">
<img src="images/logos/intel.svg" max-width="">
</div>
...
#intel {
width: 110px;
margin: 25px 0 0 100px;
}
div 的位置是绝对的。我不知道将 svg 放在页脚中是否是正确的方法。我遇到的唯一问题是尝试使用滚动插件; Varon:我只是将它包含在 header 中,添加了 css 并从 html 中调用它,设置参数等。它工作起来很奇怪,唯一显示为滚动条的是 trackbar (或全高滚动条)并且它作为滚动条移动并在到达底部时消失...它与页脚 svg 产生冲突,当向下滚动时没有任何内容(空页脚)但是如果我调整 window svg 刚刚出现,如果我向上滚动,它们就像位置固定,向上移动...
我想知道自定义滚动条的好方法,如果可能的话跨浏览器,这样它就不会隐藏部分设计(右侧)。
我阅读了很多文章和教程,但大部分都是针对 div、元素等...但我需要整个页面。这是一个没有滚动条的滚动示例(跨浏览器):http://jsfiddle.net/nCvMc/
为什么如果我给第一个 div insde body(class 一个)隐藏滚动条,为什么滚动条不隐藏?仅适用于 body 和 html.
这是link:http://satspain.sytes.net/
谢谢。
编辑:要解决 IE 中的 svg 高度问题,需要为 img 元素设置高度,而不是为 div 容器设置高度。
#intel img {
height: 60px;
{
我不知道是否最好删除容器并改为设置 img 的边距和大小(高度和宽度)...
这是一个在所有浏览器中隐藏滚动条并且仍然能够滚动的有效解决方案。只需向我们的页面添加两个额外的父 div。
<body>
<div class="one">
<div class"two">
web here (including header and footer)
</div>
</div>
</body>
解决方案:
html {
height: 100%;
overflow-x: hidden;
}
body {
height: 100%;
width: 100%;
}
.one {
height: 100%;
width: 1920px;
overflow: hidden;
}
.two {
position: relative;
height: 100%;
width: 1940px;
overflow-y: scroll;
overflow-x: hidden;
}
我的网页页脚中有 svg 徽标,它们在 firefox 和 chrome 中工作正常,但 ie11 显示 svg 的最大高度而不考虑我给的 witdh 的纵横比svg 在 css.
<div id="footer">
<div id="logos">
<div id="intel">
<img src="images/logos/intel.svg" max-width="">
</div>
...
#intel {
width: 110px;
margin: 25px 0 0 100px;
}
div 的位置是绝对的。我不知道将 svg 放在页脚中是否是正确的方法。我遇到的唯一问题是尝试使用滚动插件; Varon:我只是将它包含在 header 中,添加了 css 并从 html 中调用它,设置参数等。它工作起来很奇怪,唯一显示为滚动条的是 trackbar (或全高滚动条)并且它作为滚动条移动并在到达底部时消失...它与页脚 svg 产生冲突,当向下滚动时没有任何内容(空页脚)但是如果我调整 window svg 刚刚出现,如果我向上滚动,它们就像位置固定,向上移动...
我想知道自定义滚动条的好方法,如果可能的话跨浏览器,这样它就不会隐藏部分设计(右侧)。
我阅读了很多文章和教程,但大部分都是针对 div、元素等...但我需要整个页面。这是一个没有滚动条的滚动示例(跨浏览器):http://jsfiddle.net/nCvMc/
为什么如果我给第一个 div insde body(class 一个)隐藏滚动条,为什么滚动条不隐藏?仅适用于 body 和 html.
这是link:http://satspain.sytes.net/
谢谢。
编辑:要解决 IE 中的 svg 高度问题,需要为 img 元素设置高度,而不是为 div 容器设置高度。
#intel img {
height: 60px;
{
我不知道是否最好删除容器并改为设置 img 的边距和大小(高度和宽度)...
这是一个在所有浏览器中隐藏滚动条并且仍然能够滚动的有效解决方案。只需向我们的页面添加两个额外的父 div。
<body>
<div class="one">
<div class"two">
web here (including header and footer)
</div>
</div>
</body>
解决方案:
html {
height: 100%;
overflow-x: hidden;
}
body {
height: 100%;
width: 100%;
}
.one {
height: 100%;
width: 1920px;
overflow: hidden;
}
.two {
position: relative;
height: 100%;
width: 1940px;
overflow-y: scroll;
overflow-x: hidden;
}