Forums
View unanswered posts | View active topics It is currently Fri Oct 24, 2014 10:05 am



Reply to topic  [ 5 posts ] 
 Border Radius for li is not working in IE 7 and IE 8 
Author Message

Joined: Wed Dec 05, 2012 5:43 am
Posts: 1
Post Border Radius for li is not working in IE 7 and IE 8
My CSS

Code:
@charset "utf-8";
/* CSS Document */
#wrapper{padding:0; margin:0; width:982px; margin:0 auto; height:800px; background-color:#e0e0e0;}
#header{height:147px; width:100%; background:url(header.jpg) repeat-x top left;}
#logo{ height:115px;}
#bar{height:4px;}

#menu1-container{padding-left:3px;}
#menu1 ul{float:left; font-size:12px;}
#menu1 ul li{float:left;}
#menu1 li a:link, #menu1 li a:active, #menu1 li a:visited{display:block;padding:8px 5px 8px 5px; color:#539ed7; background:#fff; margin-right:3px;
-webkit-border-top-left-radius: 3px;
-webkit-border-top-right-radius: 3px;
-moz-border-radius-topleft: 3px;
-moz-border-radius-topright: 3px;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
behavior: url(PIE.htc);

}
#menu1 li a:hover{background:#80bbe7 !important; color:#fff;}

#menu2-container{ background:#539ed7; padding-bottom:3px; height:25px;}
#menu2{padding-left:3px;height:25px; margin-top:0; float:left;}
#menu2 ul{float:left; font-size:12px}
#menu2 ul li{float:left;}
#menu2 li a:link, #menu2 li a:active, #menu2 li a:visited{display:block; padding:6px 5px 6px 5px; color:#fff; margin-right:3px;}
#menu2 li a:hover{background:#02336b; color:#fff;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
behavior: url(PIE.htc);

}

And my HTML is
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<title>Untitled Document</title>
<link href="mystyle.css" rel="stylesheet" type="text/css" />
<link href="reset.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="wrapper">

   <div id="header">
       <div id="logo"></div>
       
        <div id="menu1-container">
          <div id="menu1">
             <ul>
              <li><a href="#">Portfolio 1</a></li>
               <li><a href="#">Portfolio 2</a></li>
               <li><a href="#">Portfolio Management</a></li>
               <li><a href="#">Portfolio view</a></li>
               <li><a href="#">Search</a></li>
              </ul>
         </div><!--menu1 ends-->
        </div>
       
       <div id="bar"></div>
      </div><!--header ends-->
   
    <div id="menu2-container">
       <div id="menu2">
           <ul>
               <li><a href="#">link1</a></li>
               <li><a href="#">link2</a></li>
               <li><a href="#">link3</a></li>
               <li><a href="#">link4</a></li>
               <li><a href="#">link5</a></li>
         </ul>
        </div><!--menu2 ends-->
    </div><!--menu2-container ends-->

</div>
</body>
</html>

<br/>

Rounded corner for li is not working in IE 7 and IE 8. Please somebody give me the solution to fix this.
Note: i have PIE.htc file, .css file and .html file in the same folder


Wed Dec 05, 2012 5:49 am
Profile

Joined: Wed Apr 24, 2013 3:05 am
Posts: 2
Post Re: Border Radius for li is not working in IE 7 and IE 8
I too am having this issue if anyone can shed any light?


Wed Apr 24, 2013 3:08 am
Profile

Joined: Wed Apr 24, 2013 3:05 am
Posts: 2
Post Re: Border Radius for li is not working in IE 7 and IE 8
OK, i sorted it and it was nothing to do with the <li>, it was simply a paths issue. Once i'd added the absolute path to the PIE.htc everything worked as expected.
So it might be worth trying to add the absolute path in your css.


Thu Apr 25, 2013 2:07 am
Profile

Joined: Fri May 31, 2013 6:17 am
Posts: 1
Post Re: Border Radius for li is not working in IE 7 and IE 8
I have the same problem, but changing to absolute path, does not change anything. I have several different classes and PIE works fine with divs, but not with list <li> and tables. Any idea why?


Fri May 31, 2013 6:25 am
Profile

Joined: Tue Jun 03, 2014 1:09 am
Posts: 1
Post Re: Border Radius for li is not working in IE 7 and IE 8
Same problem here too ...
Any idea to solve this ? I've set absolute path too...

EDIT : I found the solution ! I didn't set my elements to posision:relative and the css3pie element was having a z-index problem


Tue Jun 03, 2014 1:12 am
Profile
Display posts from previous:  Sort by  
Reply to topic   [ 5 posts ] 

Who is online

Users browsing this forum: Bing [Bot], Exabot [Bot] and 2 guests


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Search for:
Jump to:  
cron
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group.
Designed by STSoftware for PTF.