2011-10-14 32 views
6

Tôi có HTML này:Tràn: bị ẩn cho đường viền tròn bằng css3pie trong IE8?

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

và css:

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

Các src cho img được thiết lập programatically trong javascript.

img được đặt thành chiều rộng của div chứa. Trong ie9, firefox, chrome và vân vân, điều này làm cho hình ảnh có đường viền tròn (vì các góc của hình ảnh nằm ngoài biên giới và có overflow:hidden;)

Trong IE8, hình ảnh không có đường viền tròn. Thuộc tính bán kính biên giới có hiệu lực (tôi có thể nhìn thấy nó phía sau hình ảnh nếu tôi làm border: solid black 1px;) nhưng các phần của hình ảnh bên ngoài đường viền không bị ẩn.

Có cách nào xung quanh việc này bằng css, css3pie, javascript v.v. không? Hoặc là điều này không thể đạt được trong IE8?

Trả lời

6

Áp dụng border-radius cho cả hai - divimg và nó sẽ hoạt động.

+3

Tình trạng tràn ngăn xếp tình yêu .. – palmic

Các vấn đề liên quan