2012-02-14 34 views
5

đơn giản của trang để chứng minh vấn đề của tôi:Có < form > chiều cao ngắt: 100% không?

<!DOCTYPE html> 
<html> 
    <head> 
     <style type="text/css"> 
      html, body 
      { 
       height: 100%; 
       overflow: hidden; 
      } 
      body 
      { 
       margin: 0; 
       padding: 0; 
      } 
      #container 
      { 
       background: red; 
       height: 100%; 
       overflow: hidden; 
      } 
     </style> 
    </head> 
    <body> 
     <div id="container"></div> 
    </body> 
</html> 

div-chứa đầy một cách chính xác các cửa sổ trình duyệt với màu đỏ. Bây giờ, hãy bọc div theo một hình thức:

<body> 
    <form> 
     <div id="container"></div> 
    </form> 
</body> 

và thu gom div-container. Tại sao? Điều gì là nó về một thẻ hình thức 'phá vỡ' các 'ancester gần nhất với chiều cao'?

Trả lời

10

form là phần tử block, các phần tử khối không có bất kỳ chiều cao nào trừ khi nội dung của chúng mở rộng hoặc chúng được cho chiều cao một cách rõ ràng. Tổ tiên gần nhất của #containerform và chiều cao là 0, do đó, chiều cao #container s là 0.

+2

tôi đã NO dạng ý tưởng là khối – n8wrl

+0

Để được hoàn toàn rõ ràng, [ 'form' là" flow nội dung "] (http://dev.w3.org/html5/spec/the-form-element.html#the-form-element), trình duyệt sẽ sử dụng' display: block' theo mặc định. – zzzzBov

7

100% chiều cao phụ thuộc vào tất cả tổ tiên có chiều cao khai báo rõ ràng. Thêm chiều cao vào FORM và ví dụ của bạn sẽ hoạt động.

HTML, BODY, FORM { 
    height: 100%; 
} 

Điều này cũng đúng cho bất kỳ giá trị dựa trên phần trăm nào. Nếu phần tử cha không có chiều cao được chỉ định, thì phần tử của nó sẽ được định kích thước dựa trên nội dung. Do đó, chiều cao phần trăm của trẻ sẽ được dựa trên bất kỳ chiều cao nào được tính cho cha mẹ của nó.

1

thử,

<style type="text/css"> 
     html, body, form 
     { 
      height: 100%; 
      overflow: hidden; 
     } 

hoặc

<div id="container">&nbsp;</div> 

để identificate html comportament

1

Chỉ

form { 
    overflow: hidden; 
} 
Các vấn đề liên quan