WebBrowser style not applying properly in WinForms

Question

This is the HTML code I use in my WinForms application:

<html>
<head>
<style>
    #vif {
    margin:20px 5px 5px 5px;
    background-color:#888;
    }
    #inf li {
    margin-left:40px;
    color:#fff;
    }
    #inf {
    margin-top:15px;
    padding-bottom:15px;
    display:inline-block;
    }
</style>
</head>
<body>
<div id="vif">
    <div id="inf">
        <li>Hello!</li>
    </div>
</div>
</body>
</html>

When I save personally and used IE9 to display, it works fine, but when the WebBrowser uses it, the margin-top on #inf was not applied. Why? Isn't it the same IE I use? The same code display differently!

The proper render should have a gray box with margin around it and the white text should fix in the middle.

How to display properly using WebBrowser?

@AlexFilipovici IE10, but this works also in IE9, but didn't they say the WebBrowser is the same IE you have? — Daniel Cheung, Jan 22 '13 at 13:17

score 6 · Accepted Answer · answered Jan 22 '13 at 13:20

6

Add the following to your HTML's header section:

<meta http-equiv="X-UA-Compatible" content="IE=9" >

answered Jan 22 '13 at 13:20

Alex Filipovici

31,789
6
54
78

1

Thanks again for your help! and CodeCaster's – Daniel Cheung Jan 22 '13 at 13:23

score 2 · Answer 2 · edited Jun 20 '20 at 09:12

2

If the problem really is compatibility, see this question:

WebBrowser control will use whatever version of IE you have installed, but for compatibility reasons it will render pages in IE7 Standards mode by default.

If you want to take advantage of new IE9 features, you should add the meta tag <meta http-equiv="X-UA-Compatible" content="IE=9" /> inside the <head> tag of your HTML page.

edited Jun 20 '20 at 09:12

Community

1
1

answered Jan 22 '13 at 13:19

CodeCaster

147,647
23
218
272

WebBrowser style not applying properly in WinForms

2 Answers2