| darin | b5a817a | 2003-07-31 00:18:03 +0000 | [diff] [blame] | 1 | <html> |
| 2 | <head> |
| 3 | <style> |
| 4 | .middle { |
| 5 | background-color:green; |
| 6 | -moz-box-flex: 1; |
| commit-queue@webkit.org | a659cc29 | 2010-07-21 20:39:15 +0000 | [diff] [blame] | 7 | -webkit-box-flex: 1; |
| darin | b5a817a | 2003-07-31 00:18:03 +0000 | [diff] [blame] | 8 | box-flex: 1; |
| 9 | border: 10px solid olive; |
| 10 | } |
| 11 | |
| 12 | html { |
| 13 | background-color: white; |
| 14 | height: 100%; |
| 15 | } |
| 16 | |
| 17 | body { |
| 18 | height: 100%; |
| 19 | margin: 0px; |
| 20 | } |
| 21 | |
| 22 | div.outer { |
| 23 | display: -moz-box; |
| commit-queue@webkit.org | a659cc29 | 2010-07-21 20:39:15 +0000 | [diff] [blame] | 24 | display: -webkit-box; |
| darin | b5a817a | 2003-07-31 00:18:03 +0000 | [diff] [blame] | 25 | display: box; |
| 26 | -moz-box-orient: vertical; |
| commit-queue@webkit.org | a659cc29 | 2010-07-21 20:39:15 +0000 | [diff] [blame] | 27 | -webkit-box-orient: vertical; |
| darin | b5a817a | 2003-07-31 00:18:03 +0000 | [diff] [blame] | 28 | box-orient: vertical; |
| 29 | height: 100%; |
| 30 | width: 100%; |
| 31 | } |
| 32 | </style> |
| 33 | </head> |
| 34 | <body> |
| 35 | <div class="outer"> |
| 36 | <div> |
| 37 | This header should remain at the top of the browser window as you resize it. It |
| 38 | can wrap to multiple lines. The center should be filled with an olive-bordered |
| 39 | green box. It should start beneath the header, end above the footer, and fill the width of the |
| 40 | browser window. |
| 41 | </div> |
| 42 | <!--<div class="middle"></div>--> |
| 43 | <iframe class="middle" style="display: block; width:99%" src="about:blank"></iframe> |
| 44 | <div> |
| 45 | This footer should remain at the bottom of the browser window. It |
| 46 | can wrap to multiple lines if necessary. |
| 47 | </div> |
| 48 | </div> |
| 49 | </body> |
| 50 | </html> |
