2011-12-22 2 views
0

쉽게 들리지만 들리 네요. 나는 단순히 그것을 할 수 없다.960 그리드 시스템을 사용하는 센터 콘텐츠 div

<h1>Head </h1> 
<div class="container_12" > 
    <div class="grid_6"> 
     <h1>Heading one</h1> 
     <p>Content and Images</p> 
    </div> 
     <h1>Heading two</h1> 
     <p>Content and Images</p> 
    </div> 
    <div class="grid_12">The footer</div> 
    </div> 
<body> 
</body> 

나는 수직으로 화면의 모든 유형의 중앙에 정렬에 grid_6로 div의 필요 : 여기에 내가 가진 것입니다. 그것은 container_12와 주요 div 그냥 페이지의 전체 높이 걸릴하지 않습니다!? 화면 중간에서 콘텐츠 div를 플로트 할 수 있습니까?

+0

당신이 수평으로 원하는 **와 **는 수직으로 중심? – Aaron

+0

프레임 워크가 수평 중심에 있는지 확인합니다 .. 수직으로해야합니다 ... –

+0

div의 내용이 아니라 전체 div가 중간에 있어야합니다. –

답변

0

주고의 콘텐츠 사업부 이드

var screenheight = document.body.clientHeight; 
var content_div_height = document.getElementById("content_div_id").offsetHeight; 
var content_div_top = (screenheight/2) - (content_div_height/2) 
document.getElementById("content_div_id").style.top = content_div_top + 'px'; 
+0

'+ 'px' '! – Aaron

+1

심각하게, 나는 CSS 해결책을 기대하고 있었다.. 내가 이것을 조사하게 해주세요! –

+0

수직 정렬을 위해 당신은 순수한 CSS 솔루션을 위해 몸체를 고정 된 높이로 만들고 내용 부분에 최상위 위치를 부여하기 위해 – Dau

-1
*{ 
    margin:0; 
    padding:0; 
} 

body{ 
    text-align:center; /*For IE6 Shenanigans*/ 
} 

#wrapper{ 
    width:960px; 
    margin:0 auto; 
    text-align:left; 
} 
+0

이 허용 된 답변보다 더 작동합니까? –

+0

이것이 수직 정렬에 아무런 영향을 미치지 않는다는 것을 알 수 없다. –

+0

http://periperiskinwear.com/product/catalogue/ –