Remove vertical scrollbar in iframe (ASP.NET)

Question

I would like to remove (i.e. hide) the vertical scrollbar from an iframe. I have tried using overflow:hidden and scroll="no" but the scrollbar still appears.

This is what I have tried:

<iframe name = "iframemc" id="iframemc" scrolling="no" frameborder="0" style="background-color: white; float:none; margin-left:40px; overflow:hidden" runat="server" width="800px" height="620px" ></iframe>

What can I try next?

native html width/height attributes do not require a px value. — Christopher Marshall, Feb 26 '14 at 20:27

score 2 · Answer 1 · answered Feb 26 '14 at 20:25

2

Use overflow: hidden; instead, auto I think is what adds the scrollbar:

<iframe name = "iframemc" id="iframemc" scrolling="no" frameborder="0" style="background-color: white; float:none; margin-left:40px; overflow:hidden" runat="server" width="800px" height="620px" ></iframe>

keep scrolling="no" for older browsers.

answered Feb 26 '14 at 20:25

Wilf

713
1
11
26

sorry my mistake, it is just a typo. I have actually used `overflow:hidden`. Still doesn't work.. – Mayou Feb 26 '14 at 20:25
You might want to edit the question - It should hide though.... Do other values like `visible` & `auto` work then? – Wilf Feb 26 '14 at 20:29

score 1 · Answer 2 · edited May 23 '17 at 11:52

1

Sounds like you want overflow-y: hidden

Excerpt from another answer:

I'd suggest doing this with CSS. and overflow-y: hidden;

.restricted{width:200px; height:200px; overflow-y: hidden;}

Reference: Hide horizontal scrollbar on an iframe?

edited May 23 '17 at 11:52

Community

1
1

answered Feb 26 '14 at 20:26

phil

3,538
2
24
24

I don't have this option in ASP.NET.. I only have the option `overflow` in `style` – Mayou Feb 26 '14 at 20:27
Can't you use it inside a ` – Wilf Feb 26 '14 at 20:28
If you want to do this in the code behind then I would advise creating a CSS class on the page and assigning that class to the iframe using the WebControl.CssClass property http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.webcontrol.cssclass(v=vs.110).aspx – phil Feb 26 '14 at 20:29
that's what I am saying.. in the style tag, there is no option for overflow-y, there is only `overflow`. – Mayou Feb 26 '14 at 20:29

score 0 · Answer 3 · answered Feb 26 '14 at 21:00

0

This example has no scrollbars in chrome:

http://jsfiddle.net/Asb8v/3/

<div class="wrapper">
    <div class="h_iframe">
        <iframe src="http://www.cnn.com" scrolling="no" name="iframemc" id="iframemc" frameborder="0" runat="server" ></iframe>
    </div>
</div>

<style type="text/css">
    #iframemc {
        background-color: white; 
        float:none; 
        margin-left:40px; 
        overflow:hidden
    }
</style>

answered Feb 26 '14 at 21:00

phil

3,538
2
24
24

We use Internet Explorer internally, and unfortunately, the scrollbar still shows in IE – Mayou Feb 27 '14 at 16:24

score 0 · Answer 4 · answered Mar 21 '14 at 06:55

Looks like you see scrollbars of iframe content, not iframe itself. To get rid of scrollbars apply overflow:hidden and height/width:100% to html, body of iframe (or to element that has overflow:auto in iframe content). But to do so, you should have access to iframe content.

Remove vertical scrollbar in iframe (ASP.NET)

4 Answers4