2013-09-27 3 views
0

나는이 코드 슈퍼 간단한 조각이 있습니다이상한 CSS를 고정 행동

<body> 
<div style="position:fixed; width: 100%; height: 40px; background: #333"></div> 

<div style='margin-top:40px; border: 1px solid green'> 
Some contents!<br>Some contents!<br>Some contents!<br> 
</div> 

</body> 

을하지만 어떻게 든 고정 사업부는 40px의 마진을 가지고 있으며, 두 번째 DIV 중복! 아무도 내가 여기에서 놓친 것을 지적 해 주시겠습니까?

JS 바이올린 : http://jsfiddle.net/hoangkhanh/zHkkH/

감사합니다!

+0

마음? –

+1

여기에'position : fixed'가 있고, 바이올린에는'position : absolute'이 있습니까? – Vucko

답변

3

상단 div에 대해 position:absolute 세트가 있으며 top:0 위치 세트가 없습니다. 이 시도 :

<body> 
<div style="position:absolute; width: 100%; height: 40px; background: #333; top: 0"></div> 

<div style='margin-top:40px; border: 1px solid green'> 
Some contents!<br>Some contents!<br>Some contents!<br> 
</div> 

</body> 

Fiddle

2

가 고정 DIV에 오른쪽, 왼쪽 상단 또는 하단에 CSS 속성을 추가합니다. downvote 설명 예

{ 
    top: 0; /*Fixes it to the top*/ 
}