views:

259

answers:

2

Take the following html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;
<html>
<head>
    <title>Basic Layout</title>
    <style type="text/css">
        html,body,div{font-family:Verdana}
        #Head{border-bottom:solid 10px #369}
        #Body{margin-left:200px;background-color:#def}
        #Body h2{float:left;margin-left:-200px;padding:10px;font-size:1em;}
        #Foot{border-top:dashed 1px #369}
        p{page-break-inside:avoid}
    </style>
    <script>
        document.onclick = function() {
            alert(document.getElementById("Body").getBoundingClientRect().left);
        }
    </script>
</head>
<body>
    <div id="Head">
        <h1>Basic Layout Header</h1>
    </div>
    <div id="Body">
        <h2>Body Header</h2>
        <p>
            Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Mauris pretium. Morbi
            nisi velit, lacinia vitae, porttitor nec, laoreet nec, neque. Fusce id dolor. Vivamus
            scelerisque libero. Fusce aliquet gravida dui. Integer vulputate bibendum pede.
            Donec fringilla porta sem. Donec justo pede, fermentum eu, mattis a, malesuada id,
            erat. Maecenas hendrerit justo vitae felis. Praesent ut purus. Pellentesque turpis
            tortor, lobortis sed, fringilla venenatis, mattis nec, ipsum. Nunc non diam. Maecenas
            gravida mollis quam. Aenean nec urna. Quisque gravida, nulla a vulputate mattis,
            mauris justo mollis leo, et pellentesque eros augue sit amet urna. Aliquam rhoncus
            erat in mauris. Nullam ut urna. Nam pharetra, purus ac ultricies consectetuer, est
            leo aliquam augue, vitae pulvinar dui mi scelerisque mi. Integer urna. Praesent
            risus libero, porttitor vel, auctor gravida, posuere vel, felis.
        </p>
    </div>
    <div id="Foot">
        <p>Footer</p>
    </div>
</body>
</html>

Load it into your browser and click anywhere - you get 210 this is the left value for the #Body div

However on a win form with a webbrowser control on it, navigate to the same html

    webBrowser1.Navigate(_Url);

Click again, and you get 10.

Why... why... why?

A: 

Update:

added this to the head element, (I have ie8 beta 2 installed)

<META http-equiv="X-UA-Compatible" content="IE=8">

and it works (208 is shown), but

<META http-equiv="X-UA-Compatible" content="IE=7">

still shows 10, this needs to work for ie 7