[webkit-changes] cvs commit: LayoutTests/fast/box-sizing
panels-one-expected.txt panels-one.html
panels-two-expected.txt panels-two.html
percentage-height-expected.txt percentage-height.html
David
hyatt at opensource.apple.com
Thu Oct 27 01:56:49 PDT 2005
hyatt 05/10/27 01:56:49
Added: fast/box-sizing panels-one-expected.txt panels-one.html
panels-two-expected.txt panels-two.html
percentage-height-expected.txt
percentage-height.html
Log:
Add box-sizing tests.
Revision Changes Path
1.1 LayoutTests/fast/box-sizing/panels-one-expected.txt
Index: panels-one-expected.txt
===================================================================
layer at (0,0) size 800x600
RenderCanvas at (0,0) size 800x600
layer at (0,0) size 800x0
RenderBlock {HTML} at (0,0) size 800x0
RenderBody {BODY} at (0,0) size 800x0
layer at (0,0) size 800x600
RenderBlock (positioned) {DIV} at (0,0) size 800x600
layer at (0,0) size 800x40
RenderBlock (positioned) {DIV} at (0,0) size 800x40 [bgcolor=#FFC0CB]
RenderText {TEXT} at (0,0) size 46x18
text run at (0,0) width 46: "Header"
layer at (0,40) size 800x30
RenderBlock (positioned) {DIV} at (0,40) size 800x30 [bgcolor=#FA8072]
RenderText {TEXT} at (0,0) size 26x18
text run at (0,0) width 26: "Info"
layer at (0,70) size 800x60
RenderBlock (positioned) {DIV} at (0,70) size 800x60 [bgcolor=#FF00FF]
RenderText {TEXT} at (0,0) size 50x18
text run at (0,0) width 50: "Context"
layer at (0,130) size 800x470
RenderBlock (relative positioned) {DIV} at (0,130) size 800x470
layer at (0,130) size 135x470
RenderBlock (positioned) {DIV} at (0,0) size 135x470 [bgcolor=#800080]
RenderText {TEXT} at (0,0) size 70x18
text run at (0,0) width 70: "Navigation"
layer at (135,130) size 665x470
RenderBlock (relative positioned) {DIV} at (135,0) size 665x470
layer at (135,130) size 665x44
RenderBlock (positioned) {DIV} at (0,0) size 665x44 [bgcolor=#4B0082]
RenderText {TEXT} at (0,0) size 100x18
text run at (0,0) width 100: "Content Header"
layer at (135,174) size 665x381
RenderBlock (relative positioned) {DIV} at (0,44) size 665x381 [bgcolor=#FA8072]
RenderText {TEXT} at (0,0) size 50x18
text run at (0,0) width 50: "Content"
layer at (135,555) size 665x45
RenderBlock (positioned) {DIV} at (0,425) size 665x45 [bgcolor=#6495ED]
RenderText {TEXT} at (0,0) size 95x18
text run at (0,0) width 95: "Content Footer"
1.1 LayoutTests/fast/box-sizing/panels-one.html
Index: panels-one.html
===================================================================
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Panelset</title>
<style type="text/css">
/* <![CDATA */
/* html { height: 100%; } */
body{ margin: 0; /* height: 100%; */ }
.panel{
-moz-box-sizing: border-box;
box-sizing: border-box;
overflow: auto;
position: absolute;
height: 100%;
width: 100%;
}
/* ]]> */
</style>
</head>
<body>
<div style="padding: 130px 0px 0px;" id="outerPanelSet" class="panel">
<div style="background-color: pink; height: 40px; top: 0px;" id="headerPanel" class="panel">Header</div>
<div style="background-color: salmon; height: 30px; top: 40px;" id="infoPanel" class="panel">Info</div>
<div style="background-color: fuchsia; height: 60px; top: 70px;" id="contextPanel" class="panel">Context</div>
<div style="padding: 0px 0px 0px 135px; position: relative;" id="contentPanelSet" class="panel">
<div style="background-color: Purple; width: 135px; left: 0px;" id="navPanel" class="panel">Navigation</div>
<div style="padding: 44px 0px 45px; position: relative;" id="contentPanelset" class="panel">
<div style="background-color: indigo; height: 44px; top: 0px;" id="contentHeaderPanel" class="panel">Content Header</div>
<div style="background-color: salmon; position: relative;" id="contentPanel" class="panel">Content</div>
<div style="background-color: cornflowerblue; height: 45px; bottom: 0px; left: 0px;" id="contentFooterPanel" class="panel">Content Footer</div>
</div>
</div>
</div>
</body>
</html>
1.1 LayoutTests/fast/box-sizing/panels-two-expected.txt
Index: panels-two-expected.txt
===================================================================
layer at (0,0) size 800x600
RenderCanvas at (0,0) size 800x600
layer at (0,0) size 800x600
RenderBlock {HTML} at (0,0) size 800x600
RenderBody {BODY} at (0,0) size 800x600
layer at (0,0) size 800x600
RenderBlock (positioned) {DIV} at (0,0) size 800x600
layer at (0,0) size 800x40
RenderBlock (positioned) {DIV} at (0,0) size 800x40 [bgcolor=#FFC0CB]
RenderText {TEXT} at (0,0) size 46x18
text run at (0,0) width 46: "Header"
layer at (0,40) size 800x30
RenderBlock (positioned) {DIV} at (0,40) size 800x30 [bgcolor=#FA8072]
RenderText {TEXT} at (0,0) size 26x18
text run at (0,0) width 26: "Info"
layer at (0,70) size 800x60
RenderBlock (positioned) {DIV} at (0,70) size 800x60 [bgcolor=#FF00FF]
RenderText {TEXT} at (0,0) size 50x18
text run at (0,0) width 50: "Context"
layer at (0,130) size 800x470
RenderBlock (relative positioned) {DIV} at (0,130) size 800x470
layer at (0,130) size 135x470
RenderBlock (positioned) {DIV} at (0,0) size 135x470 [bgcolor=#800080]
RenderText {TEXT} at (0,0) size 70x18
text run at (0,0) width 70: "Navigation"
layer at (135,130) size 665x470
RenderBlock (relative positioned) {DIV} at (135,0) size 665x470
layer at (135,130) size 665x44
RenderBlock (positioned) {DIV} at (0,0) size 665x44 [bgcolor=#4B0082]
RenderText {TEXT} at (0,0) size 100x18
text run at (0,0) width 100: "Content Header"
layer at (135,174) size 665x381
RenderBlock (relative positioned) {DIV} at (0,44) size 665x381 [bgcolor=#FA8072]
RenderText {TEXT} at (0,0) size 50x18
text run at (0,0) width 50: "Content"
layer at (135,555) size 665x45
RenderBlock (positioned) {DIV} at (0,425) size 665x45 [bgcolor=#6495ED]
RenderText {TEXT} at (0,0) size 95x18
text run at (0,0) width 95: "Content Footer"
1.1 LayoutTests/fast/box-sizing/panels-two.html
Index: panels-two.html
===================================================================
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Panelset</title>
<style type="text/css">
/* <![CDATA */
html { height: 100%; }
body{ margin: 0; height: 100%; }
.panel{
-moz-box-sizing: border-box;
box-sizing: border-box;
overflow: auto;
position: absolute;
height: 100%;
width: 100%;
}
/* ]]> */
</style>
</head>
<body>
<div style="padding: 130px 0px 0px;" id="outerPanelSet" class="panel">
<div style="background-color: pink; height: 40px; top: 0px;" id="headerPanel" class="panel">Header</div>
<div style="background-color: salmon; height: 30px; top: 40px;" id="infoPanel" class="panel">Info</div>
<div style="background-color: fuchsia; height: 60px; top: 70px;" id="contextPanel" class="panel">Context</div>
<div style="padding: 0px 0px 0px 135px; position: relative;" id="contentPanelSet" class="panel">
<div style="background-color: Purple; width: 135px; left: 0px;" id="navPanel" class="panel">Navigation</div>
<div style="padding: 44px 0px 45px; position: relative;" id="contentPanelset" class="panel">
<div style="background-color: indigo; height: 44px; top: 0px;" id="contentHeaderPanel" class="panel">Content Header</div>
<div style="background-color: salmon; position: relative;" id="contentPanel" class="panel">Content</div>
<div style="background-color: cornflowerblue; height: 45px; bottom: 0px; left: 0px;" id="contentFooterPanel" class="panel">Content Footer</div>
</div>
</div>
</div>
</body>
</html>
1.1 LayoutTests/fast/box-sizing/percentage-height-expected.txt
Index: percentage-height-expected.txt
===================================================================
layer at (0,0) size 1982x1530
RenderCanvas at (0,0) size 800x600
layer at (0,0) size 800x0
RenderBlock {HTML} at (0,0) size 800x0
RenderBody {BODY} at (0,0) size 800x0
layer at (0,0) size 800x1530
RenderBlock (positioned) {DIV} at (0,0) size 800x1530
layer at (0,0) size 800x900
RenderBlock (positioned) zI: 1 {DIV} at (0,0) size 800x900 [bgcolor=#99CC66]
RenderBlock {DIV} at (90,90) size 620x15
RenderText {TEXT} at (0,1) size 35x15
text run at (0,1) width 35: "Header"
layer at (90,990) size 1800x2
RenderBlock (positioned) {DIV} at (0,0) size 1800x0
layer at (90,990) size 1892x2
RenderBlock (positioned) {DIV} at (0,0) size 1890x0
layer at (90,990) size 1800x2 clip at (91,991) size 1783x0 scrollHeight 30
RenderBlock (relative positioned) zI: 1 {DIV} at (0,0) size 1800x2 [bgcolor=#FFFFFF] [border: (1px solid #999999)]
RenderBlock {DIV} at (1,1) size 1783x30
RenderText {TEXT} at (0,1) size 1770x30
text run at (0,1) width 1770: "Luckily, the bit of the broadcast is now missing from BBCs website and folks in Cornwall swear they saw Bigfoot and Jersey Devil run off with miles and miles of audio tape containing tapes of Steve Jobs talking about the new Video iPod while drunk on soju, the confession of the true JFK assassin, and a tripping Chief Justice Roberts talking about how \x{201C}Green isn\x{2019}t"
text run at (0,16) width 147: "just a color, man, it\x{2019}s an idea.\x{201D}"
layer at (1980,990) size 2x2 clip at (1981,991) size -15x-15 scrollWidth 28 scrollHeight 152
RenderBlock (relative positioned) zI: 1 {DIV} at (1890,0) size 2x2 [bgcolor=#FFFFFF] [border: (1px solid #999999)]
layer at (1981,991) size 28x38 backgroundClip at (1981,991) size -15x-15 clip at (1981,991) size -15x-15 outlineClip at (1981,991) size -15x-15
RenderBlock (relative positioned) {DIV} at (0,0) size 10x38
RenderText {TEXT} at (5,5) size 23x28
text run at (5,5) width 23: "Item"
text run at (5,19) width 6: "1"
layer at (1981,1029) size 28x38 backgroundClip at (1981,991) size -15x-15 clip at (1981,991) size -15x-15 outlineClip at (1981,991) size -15x-15
RenderBlock (relative positioned) {DIV} at (0,0) size 10x38
RenderText {TEXT} at (5,5) size 23x28
text run at (5,5) width 23: "Item"
text run at (5,19) width 6: "2"
layer at (1981,1067) size 28x38 backgroundClip at (1981,991) size -15x-15 clip at (1981,991) size -15x-15 outlineClip at (1981,991) size -15x-15
RenderBlock (relative positioned) {DIV} at (0,0) size 10x38
RenderText {TEXT} at (5,5) size 23x28
text run at (5,5) width 23: "Item"
text run at (5,19) width 6: "3"
layer at (1981,1105) size 28x38 backgroundClip at (1981,991) size -15x-15 clip at (1981,991) size -15x-15 outlineClip at (1981,991) size -15x-15
RenderBlock (relative positioned) {DIV} at (0,0) size 10x38
RenderText {TEXT} at (5,5) size 23x28
text run at (5,5) width 23: "Item"
text run at (5,19) width 6: "4"
layer at (0,150) size 800x450
RenderBlock (positioned) zI: 1 {DIV} at (0,150) size 800x450 [bgcolor=#99CC66]
RenderBlock {DIV} at (90,90) size 620x15
RenderText {TEXT} at (0,1) size 32x15
text run at (0,1) width 32: "Footer"
1.1 LayoutTests/fast/box-sizing/percentage-height.html
Index: percentage-height.html
===================================================================
<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" />
<title>Box Model</title>
<style type="text/css">
* {
-moz-box-sizing: border-box;
-khtml-box-sizing: border-box;
box-sizing: border-box;
}
body {
overflow: hidden;
margin: 0;
padding: 0;
font-size: 1px;
}
.header {
position: absolute;
left: 0;
top: 0;
z-index: 1;
width: 100%;
height: 100em;
padding: 10em;
background: #9c6;
}
.footer {
position: absolute;
left: 0;
bottom: 0;
z-index: 1;
width: 100%;
height: 50em;
padding: 10em;
background: #9c6;
}
.content {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
padding: 110em 10em 60em 10em;
}
.alpha {
position: absolute;
left: 0;
top: 0;
width: 200em;
height: 100%;
}
.beta {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
padding: 0 0 0 210em;
}
.inner {
position: relative;
z-index: 1;
width: 100%;
height: 100%;
}
.alpha-inner,
.beta-inner {
position: relative;
overflow: auto;
z-index: 1;
width: 100%;
height: 100%;
border: 1px solid #999;
background: #fff;
}
.text {
font: normal 11px/15px tahoma, arial, sans-serif;
}
/* buttons as list items */
button {
display: block;
position: relative;
width: 100%;
margin: 0;
border: 0;
padding: 0;
text-align: left;
background: #fff;
font-size: 1px;
}
* html button {
margin: 0 0 -1px 0;
}
*|*::-moz-button-content {
postion: relative;
margin: 0;
padding: 0;
text-align: left;
}
button::-moz-focus-inner {
margin: 0;
border: 0;
padding: 0;
text-align: left;
}
button.selected {
color: white;
background: #316ac5;
}
button div {
display: block;
position: relative;
width: 100%;
padding: 5px;
font: normal 11px/14px tahoma, arial, sans-serif;
}
</style>
</head>
<body>
<div class="header">
<div class="text">Header</div>
</div>
<div class="content">
<div class="inner">
<div class="alpha">
<div class="alpha-inner">
<div class="text">Luckily, the bit of the broadcast is now missing from BBCs website and folks in Cornwall swear they saw Bigfoot and Jersey Devil run off with miles and miles of audio tape containing tapes of Steve Jobs talking about the new Video iPod while drunk on soju, the confession of the true JFK assassin, and a tripping Chief Justice Roberts talking about how “Green isn’t just a color, man, it’s an idea.â€</div>
</div>
</div>
<div class="beta">
<div class="beta-inner">
<button><div>Item 1</div></button>
<button class="selected"><div>Item 2</div></button>
<button><div>Item 3</div></button>
<button><div>Item 4</div></button>
</div>
</div>
</div>
</div>
<div class="footer">
<div class="text">Footer</div>
</div>
</body>
</html>
More information about the webkit-changes
mailing list