Rounded Corners Ie And Background Images

I have an item in my page thus:

Heading Text

• Summary link

  Solution 1:

  The style you use for rounded corners is only recognised by Firefox and Webkit browsers. The only other solution you have really is the use of background images. There is a jQuery plugin I used that was quite nice but again, for Internet Explorer it just places images over the corners to achieve a rounded illusion. Here it is: http://jquery.malsup.com/corner/

  EDIT: CSS3 will have a tag that achieves this, but it still is not supported by any current IE version: http://www.w3.org/TR/css3-background/#the-border-radius

  Solution 2:

  Look up http://css3pie.com/ it uses attached behaviors to give IE some css3 capabilities.

  Solution 3:

  not actually an answer.. dont shoot me but needed more chars than the comments would allow

  thanks for the replys..

  again though this does not seem to work with the backgrounds being alpha'd png's which is a shame as that appeared to be just what i needed.. tried

  .rounded{
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  background:url("10x10.50percentalpha_white.png") repeat scroll left top transparent;
  height:270px;
  overflow:hidden;
  padding:005px;
  behaviour: url(path/to/PIE.htc)
  }
  

  I am using an alpha'd background image as putting opcatiy or whatever on the div, then alphas the content too.. dont want that..

  any other suggestions? unless someone can explain a way to get the background nicely alpha'd without affecting the alphaness of the contained text/content.

  with all the funding that M$ have why cant they get rounded corners working like everyoe else has.. eh? tossers - always spend so much time getting things to work in IE that work fine everywhere else..

Share