2014-02-20 2 views
3

안녕하세요 여러분, 크기가 전혀 변경되지 않은 이유를 알아낼 수 없으므로 아무도 도와 줄 수 없습니까? 나의 이상적인 목표는 첫 번째 행을 70 %, 두 번째 행을 30 %로 만드는 것입니다. 어떤 조언을 크게 부탁드립니다테이블 행을 백분율로 조정하면 작동하지 않습니다.

<html> 
<body style="position:fixed; top:0px; left:0px;bottom:0px; right:0px; margin:0px;"> 
    <div style='display : table; width : 100%; height : 100%'> 

     <div style='display : table-row; width : 100%; height : 10%;'> 
      <div style="height:100%; width:100%; border:solid; display : table-cell;"> 
       blah 
      </div> 
     </div> 

     <div style='display : table-row; width : 100%; height : 50%;'> 
      <div style="height:100%; width:100%; border:solid; display : table-cell;"> 
       hah 
      </div> 
     </div> 

    </div> 
</body> 
</html> 
+1

왜 그냥 다음 테이블을 사용하지 않는? – witherwind

답변

1

코딩 : FIDDLE

HTML 코드 :

이 코드는 어떤 설명이있는 경우 또한, 알려주세요, 당신을 위해 도움이 될 것
<html> 
<body style="position:fixed; top:0px; left:0px;bottom:0px; right:0px; margin:0px;"> 
    <div style='display : table; width : 100%; height : 100%'> 

     <div style='display : table-row; width : 100%; height : 70%;'> 
      <div style="height:70%; width:100%; border:solid; display : table-cell;"> 
       blah 
      </div> 
     </div> 

     <div style='display : table-row; width : 100%; height : 30%;'> 
      <div style="height:30%; width:100%; border:solid; display : table-cell;"> 
       hah 
      </div> 
     </div> 

    </div> 
</body> 
</html> 

희망 ...

0

다음을 시도해보십시오.

<html> 
<body style="position:fixed; top:0px; left:0px;bottom:0px; right:0px; margin:0px;"> 
    <div style='display : table; width : 100%; height : 100%'> 

     <div style='display : table-row; width : 100%; height : 10%;'> 
      <div style="height:100%; width:70%; border:solid; display : table-cell;"> 
       blah 
      </div> 
     </div> 

     <div style='display : table-row; width : 100%; height : 50%;'> 
      <div style="height:100%; width:30%; border:solid; display : table-cell;"> 
       hah 
      </div> 
     </div> 

    </div> 
</body> 
</html> 

또는 아래 하나

<html> 
<body style="position:fixed; top:0px; left:0px;bottom:0px; right:0px; margin:0px;"> 
    <div style='display : table; width : 100%; height : 100%'> 

     <div style='display : table-row; width : 70%; height : 10%;'> 
      <div style="height:100%; width:100%; border:solid; display : table-cell;"> 
       blah 
      </div> 
     </div> 

     <div style='display : table-row; width : 30%; height : 50%;'> 
      <div style="height:100%; width:100%; border:solid; display : table-cell;"> 
       hah 
      </div> 
     </div> 

    </div> 
</body> 
</html> 

해피

예 링크가 여기에있다 ..이 코드를 사용해보십시오

관련 문제