CSS3 PIE Forums
http://css3pie.com/forum/

PIE for border-radius not working.
http://css3pie.com/forum/viewtopic.php?f=3&t=2114
Page 1 of 1

Author:  pchMK [ Fri Sep 06, 2013 3:31 am ]
Post subject:  PIE for border-radius not working.

Hi,

I am writing a page with CSS style sheet, with the script as follow:

#Manual ul li a { padding: 6px 15px;
margin: 0px 5px;
display:inline-block;
float:left;
width:100px;
min-height:30px;
text-decoration:none;
background-color:#CCCCCC;
text-align:center;
-webkit-border-bottom-right-radius:6px;
-moz-border-radius-bottomright:6px;
border-radius: 0 0 6px 0;
behavior: url(/public_html/CSS3PIE/PIE.htc)
;
margin-top:-3px;
border-top:3px #99CC00 solid;
}

My files are saved in the following manner:

>root folder
>>>public_html [folder]
>>>>>>index.html
>>>>>>CSSstyle [folder]
>>>>>>>>>style.css
>>>>>>CSS3PIE [folder]
>>>>>>>>>PIE.htc
>>>>>>>>>PIE.php

As you can see, towards the bottom of the CSS script I tried to make the border-radius work for IE8.
The page in question is "index.html", which is linked to "style.css".

When the site is activated the borders are squared in IE8 (but rounded in IE9 and Chrome).

Things that I have tried included:
(a) save the PIE.htc under the root folder or the "public_html" folder;
(b) replace "float:left" with "position:relative; z-index:0";
(c) use PIE.php instead of PIE.htc.
Unfortunately none of these worked.

Would somebody kindly let me know where the problem may be?

Much appreciated!

Author:  pchMK [ Sun Sep 08, 2013 9:59 pm ]
Post subject:  Re: PIE for border-radius not working.

Hello everyone,

After repeated testing and checking, it appears that it was a link problem after all. Although I don't understand why the previous link was wrong.
Anyway, apparently, it is best if I write "http://www.example.com/CSS3PIE/PIE.htc".

I also notice that one can have position:relative while at the same time keeping the float:left property, by writing
"float:left;
position:relative;
top:0px;
left:0px;"

Best wishes.

Author:  cosmocanuck [ Wed Oct 02, 2013 11:31 am ]
Post subject:  Re: PIE for border-radius not working.

Hi! I'm in the same boat as pchMK, at least in IE 8, which is the version I have access to - for the life of me I can't get it to work.

- Using PIE.php to ensure correct content-type.
- Placing both .php and .htc files in root folder of site and referencing with various approaches: "/PIE.php", "PIE.php", full URL with and without quotes around it...
- Tried adding position:relative and z-index:0 (though my div's are not actually set to float left)

I'm in WordPress, so I anticipated the URL path might be an issue, so even tried the PIE plugin - to no avail.

Here's a link (client site so I'm hiding the URL with Bit.ly) if it's helpful:

http://bit.ly/18PgYWE

Thanks!
adam

Author:  cosmocanuck [ Thu Oct 03, 2013 9:04 am ]
Post subject:  Re: PIE for border-radius not working.

Well, after re-reading the FAQ about known issues, I did get it to work... and have deduced the minimum requirement for it to do so:

Enclosing object has:
- display: block
- Position: relative

Rounded object has:
- display:block
- NO position or z-index needed
- in my case, PIE specified at the root with
Code:
behavior: url(PIE.php);


Thanks!

Author:  cosmocanuck [ Thu Oct 03, 2013 10:07 am ]
Post subject:  Re: PIE for border-radius not working.

Well, it all works fine in IE 8 on the homepage, but not on any other page!

I've checked and checked the source code and there is NO relevant difference I can detect between the two in either the HTML or CSS...

Here's the working homepage with rounded corners:

http://bit.ly/18PgYWE

and here's a typical "inside" page with resolutely square corners:

http://bit.ly/1bknncD

I'm almost at the end of my rope... hope someone can advise and perhaps point out something obvious I'm not seeing?

Thanks...

Author:  kamaldeep [ Fri Oct 04, 2013 3:37 am ]
Post subject:  Re: PIE for border-radius not working.

seems like you have wordpress (or wordpress/creative) set as a virtual directory on your web server.
where is ur PIE.php file located?
just to test, in your http://treetoponline.com/wordpress/wp-c ... /style.css file, under HTML.ie BODY .site, try replacing:
behavior: url(PIE.php)
with:
behavior: url(/PIE.php)

Author:  cosmocanuck [ Fri Oct 04, 2013 10:15 am ]
Post subject:  Re: PIE for border-radius not working.

Thank you, Kamaldeep! I was SO sure I'd tried that, but it looks like I hadn't, and sure enough it works.

Thanks again!
Adam

Author:  cosmocanuck [ Fri Oct 18, 2013 9:43 am ]
Post subject:  Re: PIE for border-radius not working.

How do I report bestgamenews01 as a scurvy spammer?

Page 1 of 1 All times are UTC - 7 hours [ DST ]
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
http://www.phpbb.com/