Removing border from WebBrowser control

I've got a WebBrowser control sitting on a Form which has an irritating 2px inset-looking border around it. It's causing my content to be clipped by 4 px on the right and bottom, and I can't figure out how to get rid of it. The control itself doesn't have any BorderStyle properties -- how does one remove the border?

See the red area in the screen shot:

Make it stop! http://img229.imageshack.us/img229/8342/badbadwebbrowser.gif

I want the WebBrowser to look like the blue area -- that is, to fill the Form and be flush against the Form's edges.

IE draws that as part of the default style on the body tag. Set border:0px on the body element and it goes away.

Thankfully, this is going away in IE9.

I have resolved the same problem by adding border:none; style attribute into the html element.

<html style="border:none;">

First I tried to add it into the body element but It didn't work, but it works on root html element.

The IE version used on Windows XP for WebBrowser object - I think the version 6 - interprets the root html element as having a border by default. If you have direct control over the web page displayed in the WebBrowser, you can add a style attribute directly to the HTML source of the page - as I did -, If not, There should be a way to edit the HTML inside the WebBrowser programmatically on the side of your application.

WebBrowser control inherits display style from control class. If you want to control the border style of control, you can use code like that, e.g. in Form.Designer.cs:


    using System;
    using System.ComponentModel;
    using System.Windows.Forms;

    public class wbExt : System.Windows.Forms.WebBrowser
    {
        private BorderStyle _borderStyle;
        [
        Category("Appearance"),
        Description("The border style")
        ]

        public BorderStyle BorderStyle
        {
            get
            {
                return _borderStyle;
            }
            set
            {
                _borderStyle = value;
                this.RecreateHandle();
                Invalidate();
            }
        }

        protected override CreateParams CreateParams
        {
            get
            {
                const int WS_BORDER = 0x00800000;
                const int WS_EX_STATICEDGE = 0x00020000;
                CreateParams cp = base.CreateParams;
                switch (_borderStyle)
                {
                    case BorderStyle.FixedSingle:
                        cp.Style |= WS_BORDER;
                        break;
                    case BorderStyle.Fixed3D:
                        cp.ExStyle |= WS_EX_STATICEDGE;
                        break;
                }
                return cp;
            }
        }

        public wbExt()
        {
        }
    }

Now you can change generated code in Form class.

private wbExt webBrowser1;

and rewrite creation of webBrowser item in InitializeComponent of form, like that:

this.webBrowser1 = new WindowsFormsApplication1.wbExt();

So, now

webBrowser1.BorderStyle = BorderStyle.None;

will remove any borders from webBrowser control.

I cannot reproduce the appearance you are telling about. My code in the Form1.Designer.cs is:

    this.webBrowser1.Location = new System.Drawing.Point(0, 0);
    this.webBrowser1.MinimumSize = new System.Drawing.Size(20, 20);
    this.webBrowser1.Name = "webBrowser1";
    this.webBrowser1.ScrollBarsEnabled = false;
    this.webBrowser1.Size = new System.Drawing.Size(141, 125);
    this.webBrowser1.TabIndex = 0;
    this.webBrowser1.Uri = ....

and the webcontrol is shown without the border... I'm using VS 2008 SP1/Windows 7.

Maybe you should try to add the control inside a container, e.g. a panel.

来源：https://stackoverflow.com/questions/2128259/removing-border-from-webbrowser-control

标签

.net

webbrowser-control