웹 페이지의 주요 부분에 텍스트 한정하기

Question

셋업과 같은 간단한 웹 페이지를 설치하려고합니다. 그러나

.top 
    { 
    position:absolute; 
    left:0; right:0; 
    height: 80px; 
    } 

    .left 
    { 
    position:absolute; 
    left:0; top:80px; bottom: 0; 
    width: 300px; 
    } 

    .main 
    { 
    margin-left: 30px; 
    position: absolute; 
    left:300px; top:80px; right:0; bottom:0; 
    } 

는 문제는 내가이에서 보여준대로 상단 영역에있는 텍스트의 상단에 표시되는 메인 섹션에서 텍스트를 넣어하려고 할 때 먼저 다음 상단에 텍스트를 넣어 시도하고 경우에 발생 바이올린 http://jsfiddle.net/2WZ2S/. 누군가이 문제를 해결하기위한 코드를 제안하길 원합니다.

Answer 1

은 최대 여백 크기가 충분하지 않습니다. .main { margin-left: 30px; position: absolute; left:300px; top:220px; right:0; bottom:0; }