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

时间:2015-04-20 20:53:53

标签: html css svg scrollbar

我的网页页脚中有svg徽标,并且它们在firefox和chrome中工作正常但ie11显示svg的最大高度,而不考虑我在css中给出了svg的wd的宽高比。

<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调用它,设置paramns等。它工作很奇怪,唯一显示为滚动条的是轨迹栏(或全高滚动条)并且它正在移动滚动条和消失时到达底部...它与页脚svg的创建冲突,当向下滚动时没有任何东西(空页脚)但是如果我调整窗口大小svg刚刚出现,如果我向上滚动它们的行为就像位置固定,移动颠倒...

我想知道一种自定义滚动条的好方法,如果可能的话交叉浏览器,因此它不会隐藏部分设计(右侧)。

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

为什么如果我将溢出隐藏到第一个div insde主体(第一类),滚动条不会被隐藏?仅适用于body和html。

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

感谢。

编辑:修复IE中的svg高度问题,设置img元素的高度,而不是div容器的高度。

#intel img {
    height: 60px;
{

我不知道是否最好删除容器并设置img的边距和大小(高度和宽度)......

1 个答案:

答案 0 :(得分:0)

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