3 Replies Latest reply on Sep 11, 2011 10:00 PM by mahendra rajeshirke

    rounded corner problem in IE7 and IE 8

    mahendra rajeshirke

      Hello,

       

      Been long time havent get here, a problem regarding rounded corner got me back here, some months ago i found out rounded corner hack for ie (miss nancy guided alot from alt-web).

       

      i tried the trick on http://aeonit.info/kelloggs/htc/brands.html, Plz get me out of the issue, the page doesnt work on ie7 and ie8.

       

      thnx in advance

        • 2. Re: rounded corner problem in IE7 and IE 8
          mahendra rajeshirke Level 2

          hi, thnx for comments, but i got solutions, my rounded div now look fine in all ie 6,7,8 browser,

           

          i just change the htc code as below

           

          rect.style.zIndex = el_zindex - 1;

           

          to

           

          rect.style.zIndex = el_zindex + 100001;

           

          because the roundrect tag is having minus z index.

           

          byeeeeee

          • 3. Re: rounded corner problem in IE7 and IE 8
            mahendra rajeshirke Level 2

            but again i had to face new problems i couldnt put text in it, a default black background was coming, so i changed two lines in htc file

             

                this.style.background = 'transparent';
                this.style.borderColor = 'transparent';

            so i created another div inside the cornered box and i have changed the conditional code for all ie browser as follow

             

             <td align="center" valign="top" style="position:relative; height:50px; ">

            <!--[if lt IE 7]><div class="box2" style="position:absolute; z-index:100000001; left:100px; top:0;"><div style="background-color:#fff;width: 414px;
                height: 20px; z-index:100001; color:#000;z-index:10001"><![endif]-->
            <!--[if IE 7]><div class="box2" style="position:absolute; z-index:100000001; left:100px; top:0;"><div style="background-color:#fff;width: 414px;
                height: 20px; z-index:100001; color:#000;z-index:10001"><![endif]-->
            <!--[if IE 8]><div class="box2" style="position:absolute; z-index:100000001; left:100px; top:0;"><div style="background-color:#fff;width: 414px;
                height: 20px; z-index:100001; color:#000;z-index:10001"><![endif]-->
            <!--[if gt IE 8]><!-->

            <div class="box1" style=""><div style="background-color:#fff;width: 414px;
                height: 20px; z-index:100001; color:#000;z-index:10001"><!--<![endif]-->
                              fdfdfdfd</div>
                               After step 2, your 10 year heart risk is  <font size="2" >Medium.
            </font>
                                </div>
                              </td>