Frank
New Member
I discovered a most peculiar behavior by IE9. Try this code:
The title bar is clipped and is given a (one) rounded corner. Switch to IE8 and 7, and see that they do not have the problem. Which makes me think that it is caused by the border-radius, which wasn't supported before IE9.
I have a few questions as well:
HTML:
<!DOCTYPE HTML>
<html>
<head>
<title>Demo IE9 border-radius bug</title>
<meta charset="windows-1252" />
<style>
html, body {
margin: 0;
padding: 0;
}
#main-container {
position: relative;
width: 500px;
height: 600px;
margin: 0 auto;
}
#article {
position: absolute;
width: 500px;
height: 600px;
overflow-y: hidden; /* variable 1: setting it to 'visible' or deleting it cures */
border-radius: 10px; /* variable 2: deleting it cures */
background: pink;
}
#title-bar {
position: fixed; /* variable 3: setting it to 'absolute' cures */
width: 400px;
height: 50px;
margin-left: 50px;
background: black;
}
</style>
</head>
<body>
<div id="main-container">
<div id="article">
<div id="title-bar"></div>
</div>
</div>
</body>
</html>I have a few questions as well:
- Does IE10, too, have this bug? (Don't have 10 yet.)
- Has anyone seen it described before?
- Does anyone have an address where IE bug reports can be filed *and* where actually something is done with them?
Last edited:
