Блог

У меня есть этот 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?

Применить border-radius к обоим — div и img и это должно сработать.