在 ie11 中隐藏滚动条和 svg 高度问题答案

【问题标题】：Hide scrollbar and svg height issue in ie11在 ie11 中隐藏滚动条和 svg 高度问题
【发布时间】：2015-04-20 20:53:52
【问题描述】：

我的网页页脚中有 svg 徽标，它们在 firefox 和 chrome 中运行良好，但 ie11 显示 svg 的最大高度，而不考虑我在 css 中给出的 svg 的宽高比。

<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：我只是将它包含在标题中，添加了 css 并从 html 中调用它，设置参数等。它工作起来很奇怪，唯一显示为滚动条的是轨迹条（或全高滚动条），它正在移动滚动条并在到达底部时消失...它与页脚 svg 产生冲突，向下滚动时没有任何内容（空页脚），但如果我调整窗口大小，svg 刚刚出现，如果我向上滚动，它们的行为就像位置固定，移动好处...

我想知道自定义滚动条的好方法，如果可能的话跨浏览器，这样它就不会隐藏设计的一部分（右侧）。

我阅读了很多文章和教程，但大部分都是针对 div、元素等的……但我需要整个页面。这是一个没有滚动条的滚动示例（跨浏览器）：http://jsfiddle.net/nCvMc/

为什么如果我将溢出隐藏到第一个 div insde 主体（第一类），滚动条不会隐藏？仅适用于正文和 html。

这是链接：http://satspain.sytes.net/

谢谢。

编辑：要解决 IE 中的 svg 高度问题，需要为 img 元素设置高度，而不是为 div 容器设置高度。

#intel img {
    height: 60px;
{

不知道是不是最好删除容器，改为设置img的margin和size（高宽）...

【问题讨论】：

标签： html css svg scrollbar

【解决方案1】：

这是在所有浏览器中隐藏滚动条并且仍然能够滚动的有效解决方案。只需向我们的页面添加两个额外的父 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;
}

【讨论】：