What steps will reproduce the problem? 1. In example border-radius.html, add a background color to the .rel CSS declaration.
What is the expected output? The rounded-corner elements as displayed in the unaltered border- radius.html.
What do you see instead? .box1 - no borders, no background color .box2 - not visible (text content is visible with contrasting background color for the parent element) .box3 - no background color
What version of the product are you using? Current.
On what operating system? Windows XP Pro SP3; Windows Vista Ultimate SP1; Windows 7 Professional; Windows Server 2003 R2
Please provide any additional information below. Modify the CSS declarations for the border-radius.html included in the examples zip to add a background-color to the .rel element. No other changes are needed to duplicate this problem.
The .htc calculates the z-index of the rounded-corner element to (X)-1, making it lower than that of the parent element (the .rel <div> in this case) and placing it behind the parent element when the page renders.
Also reproduced in other mark-up pages, but since it is easily reproduced in the included demo mark-up, just use it.
Comment #1
Posted on May 8, 2010 by Happy KangarooI have found a workaround for this, that worked in my project, hopefully it can help others.
Make the problem containing element itself rounded, and all is well. to further the above example, add
border-radius: 15px; behavior: url(border-radius.htc);
to the .rel class, and the elements show normally
Comment #2
Posted on Mar 5, 2012 by Swift Doghad the same problem, so i opend the script and changend Line 65-66 from:
var el_zindex = parseInt(el.currentStyle.zIndex); if (isNaN(el_zindex)) { el_zindex = 0; }
to: //var el_zindex = parseInt(el.currentStyle.zIndex); var el_zindex = 1000; if (isNaN(el_zindex)) { el_zindex = 0; }
Maybe Ie7-8 don't deliver the correct z-index level. With this i pushed it in front of all. but sadly it seems not to be possible to put anything else in front. Not even the Text contained in the original Element. Yes i tried lowering the z-index value. I'll comment again if i find a solution for this.
Status: New
Labels:
Type-Defect
Priority-Medium