사이트 리본 오버레이 + 브라우저 크기 조정

그래서 프리랜서 클라이언트는 자신의 사이트에 gubub-like 오버레이 리본을 원합니다. 그녀가 보낸 리본은 github보다 크기가 커서 브라우저의 크기를 조정하면 기존 div가 엉망이됩니다.사이트 리본 오버레이 + 브라우저 크기 조정

는 heres는 내가 사용하고 코드 : 여기

<body> 
<a href="#"><img style="position: absolute; top: 0; left: 0; border: 0;" src="ribbon.png" alt="hello"></a> 
<div class="navbar"> 
    <div class="container"> 
     <ul class="nav"> 
     <li><a href="services.html">SERVICES</a></li> 
     <li><a href="#contact">CONTACT/QUOTE</a></li> 
     </ul> 
    </div> 
</div> 

<div class="container"> 
    <div class="box">

을 (트위터 부트 스트랩에 크게 의존)과는 보이는 방법은 다음과 같습니다 http://i.imgur.com/OB1nD.png ('상자'문제의 컨테이너 박스 인)

당신이 아마 말할 수 있듯이, 만약 내가 브라우저의 크기를 조정하면 'Hey guys ..'텍스트가 리본 아래로 이동하게됩니다. 여러분이 이것을 처리 할 수있는 우아한 방법을 제공 할 수 있는지 궁금합니다. 감사!

편집 : 그냥 깨달았습니다. 용기 밖에서 리본을 부르기 때문입니다.

출처

2011-11-27 tronjavolta

... 그렇게해서는 안됩니다. 몇 가지 코드를 알려주시겠습니까? – Ryan

아, 죄송합니다. 코드를 추가했습니다. – tronjavolta

리본 이미지는 절대적으로 배치되어 있지만 div.container 및 내부 요소는 절대 배치되지 않습니다. 위치를 추가해보십시오 : 브라우저 이미지의 크기에 관계없이 올바르게 배치하려면 절대 이미지와 위쪽 + 왼쪽 이미지 (리본 이미지의 크기에 따라 다름)를 추가하십시오.

출처

2011-11-27 04:23:06 mpobrien

사이트 리본 오버레이 + 브라우저 크기 조정

답변

관련 문제