Border-radius CSS Property not working only in Internet explorer 8 | Community
Skip to main content
G
girishk76086569
New Participant
December 14, 2016
Solved

Border-radius CSS Property not working only in Internet explorer 8

  • December 14, 2016
  • 3 replies
  • 7403 views

Hi All,

We are using the border-radius css property to appear the item as circle,It is working fine in Chrome and firefox , But displaying square box in Internet Explorer instead of circle . I have tried adding the following ways of properties , But still it is showing the square box instead of circle.

border-radius: 13px !important;

border-radius: 13px;

 border-top-left-radius:13px;
border-top-right-radius:13px;
border-bottom-left-radius:13px;
border-bottom-right-radius:13px;

behavior: url(border-radius.htc);

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by kautuk_sahni

Hi 

It is very common problem with internet explorer 8 and below.

This is not an issue from AEM side, but please have a look at these following posts to get answer to your problem:

Link:- http://www.hongkiat.com/blog/css3-border-radius-in-internet-explorer/

Link:- http://stackoverflow.com/questions/17830372/how-to-apply-border-radius-in-ie8-and-below-ie8-browsers

// How to apply border radius in IE8 and below IE8 browsers?

    Option 1

    http://jquery.malsup.com/corner/

    Option 2

    http://code.google.com/p/curved-corner/downloads/detail?name=border-radius-demo.zip

    Option 3

    http://css3pie.com/

    Option 4

    http://www.netzgesta.de/corner/

border-radius is a CSS3 feature.The best script I've found to render box shadows & rounded corners in older IE versions is IE-CSS3. It translates CSS3 syntax into VML (an IE-specific Vector language like SVG) and renders them on screen.

PIE makes Internet Explorer 6-9 capable of rendering several of the most useful CSS3 decoration features Link:- http://css3pie.com/

I hope this would help you.

~kautuk

3 replies

kautuk_sahni
kautuk_sahniAccepted solution
Employee
December 15, 2016

Hi 

It is very common problem with internet explorer 8 and below.

This is not an issue from AEM side, but please have a look at these following posts to get answer to your problem:

Link:- http://www.hongkiat.com/blog/css3-border-radius-in-internet-explorer/

Link:- http://stackoverflow.com/questions/17830372/how-to-apply-border-radius-in-ie8-and-below-ie8-browsers

// How to apply border radius in IE8 and below IE8 browsers?

    Option 1

    http://jquery.malsup.com/corner/

    Option 2

    http://code.google.com/p/curved-corner/downloads/detail?name=border-radius-demo.zip

    Option 3

    http://css3pie.com/

    Option 4

    http://www.netzgesta.de/corner/

border-radius is a CSS3 feature.The best script I've found to render box shadows & rounded corners in older IE versions is IE-CSS3. It translates CSS3 syntax into VML (an IE-specific Vector language like SVG) and renders them on screen.

PIE makes Internet Explorer 6-9 capable of rendering several of the most useful CSS3 decoration features Link:- http://css3pie.com/

I hope this would help you.

~kautuk

Kautuk Sahni
L
leeasling
New Participant
December 14, 2016

Wow, people still use IE8?  That's insane.  But yeah, Scott is right, it's not an AEM issue.

smacdonald2008
smacdonald2008
New Participant
December 14, 2016

This is not really an AEM issue - more of a CSS/Browser issue. See: 

http://stackoverflow.com/questions/17830372/how-to-apply-border-radius-in-ie8-and-below-ie8-browsers

Terms & ConditionsAccessibility statement

Loading footer...