직사각형 div의 테두리에 이미지를 추가하는 방법

Question

div가 있습니다. 너비는 730px, 높이는 50px입니다. div 높이가 끝난 div의 맨 아래에 이미지를 추가하고 싶습니다 .i는 50px 높이 이후에 의미합니다. 맨 아래에 이미지를 추가하는 쿼리가 있습니다. 다른 div를 가져 와서 배경 이미지 나 다른 아이디어를 주어야합니다.

내가 사용이 샘플을 만들어

Answer 1

position: relative

http://jsfiddle.net/R67zM/2/

HTML :

<div  id="parent"> 
<div id="image">fff</div> 
</div> 

다른 콘텐츠 CSS :

​#parent { 
 width: 750px; 
 height: 50px; 
 background: red;    
 /*height of the image*/ 
 margin-bottom: 60px; 
} 
#parent #image { 
 position: relative; 
 width: 100%; 
 height: 60px; 
 background: green;  
/*height of the parent */   
 top: 50px; 
}