Encountering issues with rounded borders in IE 11 (11.0.9600.18350)? Check out this minimal fiddle for more information: https://jsfiddle.net/7phqrack/2/
Here's the HTML code snippet:
<div class="backgrounddiv">
<div class="outer">
<span id="span1">some content</span>
<div class="inner">
<span id="span2">more content in a nested div</span>
</div>
</div>
<div class="outer">
<span id="span1">some other content</span>
</div>
</div>
And here's the CSS style section:
.backgrounddiv{
background: black;
}
.outer{
border-radius: 4px 4px 0px 0px;
background: white;
}
.inner{
background: white;
}
Users have reported that at certain zoom levels (e.g., 130%), a black line is visible between the two divs and at the upper border, specifically on IE 11. Other browsers do not seem to exhibit this issue.
https://i.stack.imgur.com/JY2q3.png
If you have any insights or solutions to address this problem, please let us know!