Dreaded iframe horizontal scroll bar can't be removed in IE?

后端未结

关注

 6  1371

I have an iframe. The content is wider than the width I am setting so the iframe gets a horizontal scroll bar. I can\'t increase the width of the iframe so I want to just

相关标签:

6条回答

谎友^

2020-12-04 22:53

All of these solutions didn't work for me or were not satisfactory. With the scrollable DIV you could make the horizontal scrollbar go away, but you'd always have the vertical one then.

So, for my site where I can be sure to control the fixed height of all iframes, this following solution works very well. It simply hides the horizontal scrollbar with a DIV :)

    <!-- This DIV is a special hack to hide the horizontal scrollbar in IE iframes -->
<!--[if IE]>
<div id="ieIframeHorScrollbarHider" style="position:absolute; width: 768px; height: 20px; top: 850px; left: 376px; background-color: black; display: none;">
</div>
<![endif]-->
<script type="text/javascript">
  if (document.getElementById("idOfIframe") != null && document.getElementById("ieIframeHorScrollbarHider") != null)
  {
    document.getElementById("ieIframeHorScrollbarHider").style.display = "block";
  }
</script>

0 讨论(0)

孤街浪徒

2020-12-04 23:00
```
<iframe style="overflow:hidden;" src="about:blank"/>
```
should work in IE. IE6 had issues supporting overflow-x and overflow-y.

One other thing to note is that IE's border on the iframe can only be removed if you set the "frameborder" attribute in camelCase.
```
<iframe frameBorder="0" style="overflow:hidden;" src="about:blank"/>
```
it would be nice if you could style it properly with CSS but it doesn't work in IE.
0 讨论(0)
发布评论:

提交评论
- 加载中...
北海茫月

2020-12-04 23:08

You can also try setting the width of the body of the page that's included inside the iframe to 99%.

0 讨论(0)
发布评论:

提交评论
- 加载中...
醉酒成梦

2020-12-04 23:09

The scrollbar isn't a property of the <iframe>, it's a property of the page that it contains. Try putting overflow-x: hidden on the <html> element of the inner page.

0 讨论(0)
发布评论:

提交评论
- 加载中...
北海茫月

2020-12-04 23:13
```
scrolling="yes"  horizontalscrolling="no" verticalscrolling="yes"
```
Put that in your iFrame tag.

You don't need to mess around with trying to format this in CSS.
0 讨论(0)
发布评论:

提交评论
- 加载中...

甜味超标

2020-12-04 23:18

You could try putting the iframe inside a div and then use the div for the scrolling. You can control the scrolling on the div in IE without issues, IE only really has problems with iframe scrolling. Here's a quick example that should do the trick.

<html>
    <head>
        <title>iframe test</title>

        <style>         
        #aTest { 
            width: 120px;
            height: 50px;
            padding: 0;
            border: inset 1px #000;
            overflow: auto;
        }

        #aTest iframe {
            width: 100px;
            height: 1000px;
            border: none;
        }
        </style>
    </head>
    <body>
        <div id="aTest">
            <iframe src="whatever.html" scrolling="no" frameborder="0"></iframe>
        </div>
    </body>
</html>

0 讨论(0)