Hi All,

I have been building a site using the css3pie theme Jason kindly linked me for wordpress. Love the theme, and the effects achievable with PIE. Thouht it was going really well until I got home from work today, and logged on to add some content.

All of the layout is messed up and I cannot figure out why. It still looks fine in chrome and firefox and I assume will be ok on IE8 which is what i was using earlier today. I have tried the following.

1. Placed the pie.htc (and other files) in the web directory route and accessed them using behaviour: url(/pie.htc)
2. instead of using pie.htc I have tried using pie.php

neither of these seemed to work. The only thing that does have an effect is putting the following line of code in the header file (found this from google)

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />

This causes the site to render almost correctly in IE9 the only issues being that whenever the a menu item is selcted there is a really annoying flicker across the whole site, another minor issue being the navigation menu has a 1pixel gap between thewhite of the content area and the hightlighted white selected menu.

I have removed this line for now, the site can be seen at http://www.cordnerlewis.com\cordnerlewis

Really appreciate any help with this, either in getting the elements to position in IE9 correctly or resolving the flicker and 1 pixel alignment. Ideally I would opt for just getting ie9 to display it correctly. I assume this can be done as I have no issues viewing css3pie.com

Thanks

Ian

Update - I have done some more playing around with this and whilst I am not much further forward there is some further information to share.

1. If compatablity mode is turned on in IE9 the page renders witht he menus in the correct place, ie. on the blue/green on the right hand side. However the <p> items that come afterwards effectively the donate/download items on the css3pie site are all bunched together with no vertical space between them.

2. If I go through the stylesheet and comment out all of the references to pie then the site renders fine in IE9. This is assuming I am in compatability mode. If i take it off then the site becomes jumbled again with the menus not being positioned correctly.

3. Interestingly I have also run this through IETester and it seems that the collapsing of the <p> elements (mentioned in 1 above) occurs in any version of IE except 8. something very strange going on here.

Seems that page doesn't exist anymore.

Hi Jason,

apologies for that, I moved the site to the root folder yesterday. I did manage to solve this in the yesterday, I am sure there is a better way, but what I actually did was place a </br> in between each of the affected elements. This seemed to do the trick.

The only real issue I have now and I will gladly take any advice on this is that although the page now renders as it should in ie6, ie7, ie8 and ie9, along with the other browsers such as firefox and chrome. There is still a problem with IE9 in that it only renders correctly if compatability mode is turned on. This has thrown some people who have looked at it as they are not aware of this feature.

As I previously mentioned the theme I am using is the css3pie one you linked, so I am sure there is a fix for the IE9 compatability mode thing as Css3 pie renders fine with in IE9 with it turned on or off.

Other than that it totally rocks I am so glad I stumbled on CSS3PIE. gone are the days of slicing images for rounded corners and drop shadows. Just wish i actually understood all the code behind it. I took a quick look and its pretty mind boggling

Thanks again