Forums
FAQ • Search • Login
Register
View unanswered posts | View active topics It is currently Tue May 21, 2013 11:06 pm

Board index » Troubleshooting Help: 1.0.x

All times are UTC - 7 hours [ DST ]



Reply to topic  Page 1 of 1
  [ 5 posts ] 
Print view Previous topic | Next topic 
 Sub menu IE8 
Author Message
robert475

Joined: Fri Nov 11, 2011 10:59 am
Posts: 5
Post Sub menu IE8
Hi

http://demo.seevu.co.uk

When you hover over the menu and the sub menu appears, i want the container of the sub menu to have a border radius of 10px as it does in IE9, firefox etc.

Here is my code:
Code:
#nav ul {
   display: none;
   z-index:9999;
   width: 245px;
   position: absolute;
   top: 30px;
   left: 0;
   font-size:12px;
   text-align:left;
   line-height:24px;
   color:#000;
   text-decoration:none;
   padding:0px;
   border: 1px solid #e0e0e1;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;
   background: #FFFFFF;
   behavior: url(/pie/PIE.htc);   
}


Can anyone indicate where i have gone wrong please?
Mon Feb 20, 2012 9:27 am
Profile
jason

Joined: Wed Jul 14, 2010 11:46 am
Posts: 1396
Post Re: Sub menu IE8
Well since you're adding a gradient background to the <a> elements in each submenu, those square backgrounds stick out of the rounded corners of the container. You need to round the appropriate corners of the top and bottom <a> elements in each menu.
Mon Feb 20, 2012 9:43 am
Profile
robert475

Joined: Fri Nov 11, 2011 10:59 am
Posts: 5
Post Re: Sub menu IE8
jason wrote:
Well since you're adding a gradient background to the <a> elements in each submenu, those square backgrounds stick out of the rounded corners of the container. You need to round the appropriate corners of the top and bottom <a> elements in each menu.


Thanks for your speedy response....

I have removed the gradient for each link on the submenu but the container is still square.

Code:
#nav a {
   font-size: 12px;
   color: #000;
   text-decoration: none;
   display: block;
   padding:  8px 20px;
   margin: 0;
   border-radius: 10px 10px 0px 0px;
   /*background: -webkit-gradient(linear, 0 0, 0 bottom, from(#FFFFFF), to(#DADBDC));
   background: -webkit-linear-gradient(#FFFFFF, #DADBDC);
   background: -moz-linear-gradient(#FFFFFF, #DADBDC);
   background: -ms-linear-gradient(#FFFFFF, #DADBDC);
   background: -o-linear-gradient(#FFFFFF, #DADBDC);
   background: linear-gradient(#FFFFFF, #DADBDC);
   -pie-background: linear-gradient(#FFFFFF, #DADBDC);*/
   behavior: url(/pie/PIE.htc);   
   }
Mon Feb 20, 2012 10:28 am
Profile
jason

Joined: Wed Jul 14, 2010 11:46 am
Posts: 1396
Post Re: Sub menu IE8
Not sure but it looks like you're removing the border-radius when the menu is opened?

Code:
#nav li:hover > ul {
   display: block;
   /*background:none;*/ border-radius: 0px 0px 0px 0px;
}
Mon Feb 20, 2012 11:16 am
Profile
robert475

Joined: Fri Nov 11, 2011 10:59 am
Posts: 5
Post Re: Sub menu IE8
Hi Jason i tried what you said but it just removes the background of the menu altogehter.

Any ideas please?
Wed Feb 22, 2012 7:09 am
Profile
Display posts from previous:  Sort by  
Reply to topic   Page 1 of 1
  [ 5 posts ] 

Board index » Troubleshooting Help: 1.0.x

All times are UTC - 7 hours [ DST ]

Who is online

Users browsing this forum: Google [Bot] and 7 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:  
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group.
Designed by STSoftware for PTF.