2012-11-08 1 views
-1

두 개의 div가 있고 두 번째 div에 큰 배경을 적용하고 배경 위치를 왼쪽으로 이동합니다. 나는 그것이 전체적으로 보이도록 유지하고 음수 마진이나 다른 재미있는 사업을 사용하는 것을 피하면서 첫 번째 div 아래 숨겨지기를 원하지 않습니다. 이제 오버플로 때문에 숨겨집니다. 물론 숨겨져 있습니다. 어떤 아이디어입니까?스태킹 배경 : 다른 div에서 보이게 만드는 방법

여기에 http://tinkerbin.com/UqYLFKZG 예입니다. 여기

코드입니다 :

HTML :

<div class="left"> 
<ul> 
    <li>one item</li> 
    <li>one item</li> 
    <li>one item</li> 
    </ul> 
</div> 
<div class="middle"> 
<ul> 
    <li>one item</li> 
    <li>one item</li> 
    <li>one item</li> 
    </ul> 
</div> 

CSS

.left {float:left;width:100px;} 
.middle {overflow:hidden;background:url("http://farm8.staticflickr.com/7116/8163983721_1ed2414765_b.jpg") no-repeat;background-position:-400px -200px;} 

편집 : 부정 투표에 의해 놀라게 조금; 실제로, 오버플로를 제거 할 때 나는 대답하기가 너무 쉬워 보입니다 : 숨겨진, 왼쪽이 문서의 정상적인 흐름에 있지 않았기 때문에 중간의 내용이 왼쪽의 내용과 겹쳐졌습니다. 따라서 나는 일부 왼쪽 여백 또는 패딩이 문제를 해결합니다.

+1

완전하게 보이는 것이 무엇입니까? –

+0

나는 그것을 얻을 수 없다. 오버플로를 제거한 경우 : 숨김 다음 두 div의 텍스트와 전체 이미지를 볼 수 있습니다 (수직으로 정렬되지 않은 경우에도 ...). 정확히 달성하기를 원하십니까? –

+0

실제로,하지만 내가 게시 한 시간에 내가 오버플로 제거 생각 : 내 중간 div (왼쪽 된 div 오른쪽에 위치) 잃어 버릴 것입니다 (겹치는 콘텐츠 등),하지만 이것은 몇 가지 왼쪽 여백/중앙 div .. 패딩 –

답변

0

해결 방법은 overflow : hidden을 제거하고 .middle을 올바르게 배치하기 위해 margin-left 또는 padding을 .left div의 크기와 같게 왼쪽에 추가하는 것입니다.