Home/ Questions/Q 8851033
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-14T13:02:44+00:00

I have this simple HTML <html> <head> <style> </style> </head> <body> <div style=position: relative;

  • 0

I have this simple HTML

<html>
<head>
    <style>
    </style>
</head>
<body>
<div style="position: relative; overflow: visible; width: 100%; height: 100%;" class="surface">
    <div style="width: 300px; max-height: 2px; height: 2px; position: absolute; left: 36.165px; top: 0.8957px; border: 1px solid red;"></div>
    <div style="width: 1px; height: 200px; position: absolute; left: 30.165px; top: 47.8957px; border: 1px solid red;"></div>   
</div>
</body>
</html>

There are basically two divs: one “horizontal” (height 2px) and one “vertical” (height 2px).

When I view the page on firefox:

enter image description here

while on IE (8) something weired happens:

enter image description here

the top DIV is not 2px high.

Any idea why is that so ?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Your possible solutions :

    1). Add display: block to your style

    2). check you have a proper DOCTYPE otherwise (IE) quirks mode will produce unexpected format and results. Check this article for reference

    • 0