html - Strange space between element with border radius and it's absolute positioned pseudo content -
i've got problem on ie10 regarding element border radius , absolute positioned pseudo content.
so, html:
<div id="parent"> <div id="border"> </div> </div>
and css:
#parent { width: 200px; height: 200px; } #border { width: 50px; height: 50px; border-radius: 5px; background: gray; position: relative; } #border:after{ content: ""; display: block; position: absolute; width: 30px; height: 50px; background: green; left: 100%; top: 0; }
rendering on chrome:
rendering on ie10:
here's jsfiddle link.
can me solve mystery?
thank you!
tested on: 3 different machines windows 7 , ie10.
i'm using ie11 (tested in ie10 well) fiddle , yes see tiny little white space on both, , rendering on ff.
change left:100%
left:99.9%
Comments
Post a Comment