CSS 열이 겹치기를 원합니다

Question

저는 Stackoverflow를 통해 검색하여 CSS 열에서 중복되는 것을 피하려고하는 사람들을 많이 찾았지만 실제로는 텍스트와 이미지가 겹치도록 요청 받았습니다.

UPDATE :

더 나은 이미지가 내가 할 물어 봤는데 무엇인지 설명하고, 내가 사용하는 코드에 대한 링크. 감사! 코드

^{http://unfetteredletters.com/webdev/twocolumnlayout.jpg}

링크 : http://unfetteredletters.com/webdev/AF_columnLayout/AF_2columnLayout.html

이 가능합니까?

Answer 1

음수 여백을 사용하면 다음과 같이 할 수 있습니다. 이 밖에

확인 : http://coding.smashingmagazine.com/2009/07/27/the-definitive-guide-to-using-negative-margins/

#content {margin-right:-100px;} 

Answer 2

가 귀하의 질문에 대답하려면, 그래이 가능하다.

질문하지 않은 질문에 대답하려면 이미지 배경 이미지를 만들 수 있습니다.

Answer 3

이미지의 포함 블록을 설정해야하고 표시 할 div CSS 속성은 상대적입니다. display 속성과 겹칠 자식을 절대로 설정하십시오. 이제 오른쪽 및 왼쪽 위 또는 아래에 적절한 픽셀을 배치 할 수 있습니다. 하지만 당신은 정말 당신이 사용할 수있는 대답을 제공하기 쉽도록 CSS 스타일을 제공해야합니다.

Answer 4

내가 생각할 수있는 유일한 점은 이미지에 음수 여백을 사용하는 것뿐입니다. 그러나 첫 번째 이미지를 두 번째 컨테이너에 배치하고 이미지의 높이를 알고있는 경우에만 작동합니다. 예를 들어 괜찮 으면 좋겠지 만 모든 가능성에 맞는 솔루션이 아닙니다.

HTML

<div> 
    [TEXT] 
</div> 

<div> 
    <img src="[URL]" alt="[ALT]"> 
    [TEXT] 
</div> 

CSS

height, width 및 margin 값은 단지 예를 들어 값입니다.

div { 
    float: left; 
    width: 300px; 
    margin: 0 20px 0 0; 
    vertical-align: top; 
} 

div:nth-child(1) { 
    padding: 250px 0 0 0; 
} 

img { 
    float: left;   
    width: 350px; 
    margin: 0 0 0 -320px; 
} 

데모

Try before buy