퍼센트 컨테이너 안에 백분율로 떠있는 컨테이너

Question

나는 알아낼 수없는 간단한 문제가 있습니다. 이 HTML 코드를보고 :

<div id="container"> 
    <div id="content"> 
     <div id="menu"> 
      <ul> 
       <li><a href="#" class="active">pagina's</a></li> 
       <li><a href="#">home</a></li> 
       <li><a href="#">kamers</a></li> 
       <li><a href="#">over ons</a></li> 
      </ul> 
     </div> 
     <div class="clearfloats"></div> 
     <div id="cmscontent"> 
      <div id="sidebar"> 
       <ul> 
        <li><a href="#" class="overzicht active">overzicht van de pagina's</a></li> 
        <li class="last"><a href="#" class="toevoegen">pagina toevoegen</a></li> 
       </ul> 
      </div> 
      <div id="main"> 
       <h1 class="maintitle"> 
        overzicht van de pagina's 
       </h1> 
       <div id="maincontent"> 
        sdfsd 
       </div> 
      </div> 
      <div class="clearfloats"></div> 
     </div> 
    </div> 
</div> 

CSS :

#container { 
width: 84%; 
margin: 0 auto; 
} 

#content { 
margin-top: 50px; 
min-width: 1140px; 
} 

#cmscontent { 
background-color: #ffffff; 
border: 1px solid #e0e0e0; 
padding: 44px 30px 44px 30px; 
position: relative; 
z-index: 3; 
} 

#sidebar{ 
padding: 14px 24px 14px 24px; 
width: 306px; 
background-color: #f8f8f8; 
float: left; 
} 

#main { 
float: left; 
margin-left: 80px; 
width: 100%; 
} 

문제는 그 마지막 용기 : #main이 표준이 가지고있는 내용으로 전용으로 넓다. 그래서 나는 그것 (px)에 고정 폭을 추가 할 의무가있다. 내 디자인의 요점은 부동 소수점 div를 가지고 있기 때문에 불만입니다. 100 % 너비 또는 다른 숫자를 %로 추가하면 자체 문제가 발생합니다.

나를위한 해결책이 있습니까?

감사합니다.

http://www.mathijsdelva.be/cms/

난 아무것도 finetuned하지 않은; 나는 지금 막 사파리를 위해 다만 html'ed.

Answer 1

문제는 마지막 컨테이너 : #main, standard는 내용과 동일하다는 것입니다.

#main을 사용하여 표시를 시도 했습니까?

실제로 여기서 무엇을하려고합니까? 유연한 디자인을 만들려고하십니까?