브라우저 레이아웃으로 제한된 CSS 레이아웃?

Question

저는 HTML과 CSS로 묘사 된 레이아웃을 어떻게 달성 할 수 있는지 알아 내려고 적어도 10 시간을 보냈습니다. 나는 끊임없이 수색을하고 많은 답변이 가까이 오는 것처럼 보이지만, 나는 그것을 제자리로 조정할 수 없다.

머리글, 바닥 글, 왼쪽에 메뉴 모음, 기본 콘텐츠로 탐색 모음이있는 간단한 브라우저 응용 프로그램을 만들고 싶습니다. 맵을 컨텐트 div에 제한하고 "오버플로 - 그러나 - 숨김"으로 제한하지 않길 바란다. 그리고 모든 스크롤바가 없다면, 모든 것이 제자리에 들어 맞으면 사랑할 것입니다. CSS로 가능합니까?

제발, 내가 죽어 가고있어!

Answer 1

물론 고정 된 모든 것을 배치 할 수 있습니다. 그런 식으로 원하는대로 저에게 들립니다. (대해서는 "결코 어떤 스크롤바를, 모든 것이 제자리에 맞게".) 를하는 당신이 원하는 경우, 다음과 같이 할 수있는이 같은으로

body,#header,#menu,#footer,#content { 
    position:fixed; 
    margin:0; 
    padding:0; 
} 
#header { 
    top:0; 
    left:0; 
    right:0; 
    width:auto; 
    height:40px; 
} 
#menu { 
    left:0; 
    top:45px; 
    bottom:35px; 
    height:auto; 
    width:120px; 
} 
#footer { 
    bottom:0; 
    left:0; 
    right:0; 
    width:auto; 
    height:30px; 
} 
#content { 
    right:0; 
    top:45px; 
    bottom:35px; 
    left:125px; 
    min-width:200px; 
    min-height:200px; 
    height:auto; 
    width:auto; 
} 
#navbar { 
    position:relative; 
    height:30px; 
    display:block; 
    min-width:200px; 
} 
#map { 
    position:absolute; 
    top:30px; 
    left:0; 
    right:0; 
    bottom:0; 
    width:auto; 
    height:auto; 
} 

을, 모든 요소는하고에 남아있을 것입니다 장소 만 있으면 내용이 창 크기로 조정됩니다. 비록 내가 인정하지 않아도, 나는 정말로 당신이 요청한 것을 얻는다. 나는 당신의 필요에 맞는 이런 종류가되기를 바랍니다. 솔직히 말하면, CSS 기초를 배우는 데 어려움을 겪고있는 것 같아 조금은 이상하게 보입니다.