
Unable to get functioning
I am not sure what I am doing wrong here, but I can't get PIE to work at all via my local Dev environment using MAMP.
First, is my problem that I'm running locally? I used PIE on another site and it works in IE8 (But not IE7).
I am using the Joomla CMS with a custom template (Base of yoo_master theme with custom style).
The root path is:
/MAMP/htdocs/jobs/
My CSS files are located in the following path (As I'm trying to mod the menu, I have included the path to that file.
/MAMP/htdocs/jobs/templates/yoo_master/styles/glencoe/css/menus.css
I placed the PIE file in:
/MAMP/htdocs/jobs/templates/yoo_master/styles/glencoe/
The CSS I am using is:
Code:
.menu-dropdown a.level1,
.menu-dropdown span.level1 {
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
color: #fff;
font-weight: bold;
border: 0;
text-transform: uppercase;
behavior: url(templates/yoo_master/styles/glencoe/PIE.htc);
}
.menu-dropdown li.level1:hover .level1,
.menu-dropdown li.remain .level1,
.menu-dropdown li.active .level1 {
background: #A9B533;
box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.3) inset, 0 1px 3px rgba(0, 0, 0, 0.5) inset;
color: #fff;
behavior: url(templates/yoo_master/styles/glencoe/PIE.htc);
}
If I view the CSS in FireFox using FireBug, the behavior element is not seen at all, and when I go to IE7 (VIA CrossOver) and IE 8 (VIA Parallels) the menu items don't have the rounded corners or the shadows.
Am I using the wrong path? Is there anything else somebody can see that I am doing wrong?
This is driving me batty!