는 아직도 정답, 중심을

<html> 
<head> 
    <title> 
     Learning CSS 
    </title> 
    <style type="text/css"> 
     #header 
     { 
      padding:1px; 
      margin:1px; 
      border:1px solid #808080; 
      text-align:center; 
      height:100px; 
      background-color:#804040; 

     } 
     .clear 
     { 
      float:none; 
      clear:both; 
     } 

     #wrapper 
     { 
      width:700px; 
      margin:0 auto; 
      border:1px solid #808080; 
      padding:2px; 
      clear:both; 
      overflow:hidden; 
     } 
     #body_left 
     { 
      display:block; 
      height:100%; 
      position:relative; 
      width:130px; 
      float:left; 
      border:1px solid #808080; 
      margin-right:2px; 
     } 
     #body_center 
     { 
      position:relative; 
      width:430px; 
      float:left; 
      border:1px solid #808080; 
      background-color:#ffa980; 
     } 
     #body_right 
     { 
      position:relative; 
      width:130px; 
      float:left; 
      border:1px solid #808080; 
      margin-left:2px; 
     } 
     #footer 
     { 
      padding:1px; 
      margin:1px; 
      border:1px solid #808080; 
      text-align:center; 
     }   
    </style> 

</head> 

<body> 
    <div id="wrapper"> 
     <div id="header">&nbsp;</div> 
      <div id="body_left">&nbsp;</div> 
      <div id="body_center">Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br /> 
     Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br /> 
     Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br /> 
     Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br /> 
     Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br /> 
     Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br /> 
     Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br /></div> 
      <div id="body_right">&nbsp;</div> 
      <div class="clear"></div> 
      <div id="footer">&nbsp;</div> 
    </div> 
</body>

는 아직도 정답, 중심을

을 조정합니다. 제발 도와주세요

출처

2010-12-02 aeruL

사용 http://www.jsfiddle.net/ – ArK

나는 이것이 당신이 :)

http://jsfiddle.net/JeaffreyGilbert/RtZFJ/

출처

2010-12-02 06:11:50

+1 높이없이 트릭을 할 것 같다 아주 멋진 솔루션을 찾고있는 무슨 생각 100 %. – Bazzz

최대 축척은 #body_left입니까? 상위에 높이가 설정되어 있지 않으므로 상위에 높이가없는 경우 높이를 100%으로 정의 할 수 없습니다.

당신은 HTML 적절한 높이 참조주고, 상단이 CSS를 추가 할 수 있습니다

html, body, #wrapper 
{ 
    height: 100%; 
}

귀하의 전체 코드는 다음과 같을 것이다 : 여기

<html> 
    <head> 
     <title> 
      Learning CSS 
     </title> 

     <style type="text/css"> 
      html, body, #wrapper 
      { 
       height: 100%; 
      } 

      #header 
      { 
       padding:1px; 
       margin:1px; 
       border:1px solid #808080; 
       text-align:center; 
       height:100px; 
       background-color:#804040; 
      } 

      .clear 
      { 
       float:none; 
       clear:both; 
      } 

      #wrapper 
      { 
       width:700px; 
       margin:0 auto; 
       border:1px solid #808080; 
       padding:2px; 
       clear:both; 
       overflow:hidden; 
      } 

      #body_left 
      { 
       display:block; 
       height:100%; 
       position:relative; 
       width:130px; 
       float:left; 
       border:1px solid #808080; 
       margin-right:2px; 
      } 

      #body_center 
      { 
       position:relative; 
       width:430px; 
       float:left; 
       border:1px solid #808080; 
       background-color:#ffa980; 
      } 

      #body_right 
      { 
       position:relative; 
       width:130px; 
       float:left; 
       border:1px solid #808080; 
       margin-left:2px; 
      } 

      #footer 
      { 
       padding:1px; 
       margin:1px; 
       border:1px solid #808080; 
       text-align:center; 
      } 
     </style> 
    </head> 

    <body> 
     <div id="wrapper"> 
      <div id="header">&nbsp;</div> 
      <div id="body_left">&nbsp;</div> 
      <div id="body_center">Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br /> 
       Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br /> 
       Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br /> 
       Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br /> 
       Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br /> 
       Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br /> 
       Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br />Center<br /></div> 
      <div id="body_right">&nbsp;</div> 
      <div class="clear"></div> 
      <div id="footer">&nbsp;</div> 
     </div> 
    </body> 
</html>

는 바이올린의를 : http://www.jsfiddle.net/rASmX

또한 DOCTYPE을 추가하십시오. 브라우저가 CSS를 더 잘 이해할 수있게 도와줍니다.

행운을 빈다.

출처

2010-12-02 05:35:05 Blender

는 아직도 정답, 중심을

답변

관련 문제