: trước và hình nền ... nó có hoạt động không?

Question

Tôi đã có một div và áp dụng :before và :after một hình ảnh làm nội dung. Điều đó hoạt động hoàn hảo. Bây giờ tôi sẽ cần phải áp dụng một hình ảnh nền để nó lặp lại như là div thay đổi kích thước, nhưng nó dường như không hoạt động. Hình nền trên :before và :after có đang hoạt động không?

Mã hiện tại:

HTML:

<div id="videos-part">test</div> 

CSS:

#videos-part{ 
    background-color: #fff; 
    height: 127px; 
    width: 764px; 
    margin: -6px 0 -1px 18px; 
    position: relative; 
} 
#videos-part:before{ 
    width: 16px; 
    content: " "; 
    background-image: url(/img/border-left3.png); 
    position: absolute; 
    left: -16px; 
    top: -6px; 
} 

Answer 1

@michi; xác định height trong before lớp giả của bạn

CSS:

#videos-part:before{ 
    width: 16px; 
    content: " "; 
    background-image: url(/img/border-left3.png); 
    position: absolute; 
    left: -16px; 
    top: -6px; 
    height:20px; 
} 

Answer 2

Bối cảnh hình ảnh trên :before và :after yếu tố nên làm việc. Nếu bạn đăng một ví dụ tôi có thể có thể cho bạn biết lý do tại sao nó không hoạt động trong trường hợp của bạn.

Dưới đây là một ví dụ: http://jsfiddle.net/namas/3/

Bạn có thể xác định kích thước của nguyên tố này trong% bằng cách sử dụng background-size: 100% 100% (chiều rộng/chiều cao), ví dụ.