Препълване: скрито за заоблени граници с помощта на css3pie в IE8?

Имам този HTML:

<div id="micrositePhotoDiv">
    <img id="micrositePhoto" />
</div>

и css:

#micrositePhotoDiv {
    overflow:hidden;
    @include border-radius(10px);
    behavior: url(PIE.htc);
}

Src за img се задава програмно в javascript.

img е зададен на ширината на съдържащия се div. В ie9, firefox, chrome и т.н. това кара изображението да има заоблени граници (защото ъглите на изображението са извън границите и има overflow:hidden;)

В IE8 изображението няма заоблени граници. Свойството border-radius влиза в сила (мога да го видя зад изображението, ако направя border: solid black 1px;), но частите на изображението извън границите не са скрити.

Има ли някакъв начин за това с помощта на css, css3pie, javascript и т.н.? Или това не е възможно да се постигне в IE8?


person Oliver    schedule 14.10.2011    source източник


Отговори (1)


Приложете border-radius към двете - div и img и трябва да работи.

person easwee    schedule 14.10.2011