Changeset 119131 in webkit


Ignore:
Timestamp:
May 31, 2012 12:08:19 PM (12 years ago)
Author:
tony@chromium.org
Message:

rename flexbox CSS properties from flex-align and flex-item-align to align-items and align-self
​https://bugs.webkit.org/show_bug.cgi?id=87907

Reviewed by Ojan Vafai.

Source/WebCore:

This was recently changed in the spec:
​http://dev.w3.org/csswg/css3-flexbox/#align-items-property

No new tests, updated the tests to use the new naming.

  • css/CSSComputedStyleDeclaration.cpp:

(WebCore):
(WebCore::CSSComputedStyleDeclaration::getPropertyCSSValue):

  • css/CSSParser.cpp:

(WebCore::isValidKeywordPropertyAndValue):
(WebCore::isKeywordPropertyID):
(WebCore::CSSParser::parseValue):

  • css/CSSPrimitiveValueMappings.h:

(WebCore::CSSPrimitiveValue::CSSPrimitiveValue):
(WebCore::CSSPrimitiveValue::operator EAlignItems):

  • css/CSSProperty.cpp:

(WebCore::CSSProperty::isInheritedProperty):

  • css/CSSPropertyNames.in:
  • css/StyleBuilder.cpp:

(WebCore::StyleBuilder::StyleBuilder):

  • css/StyleResolver.cpp:

(WebCore::StyleResolver::collectMatchingRulesForList):

  • rendering/RenderBox.cpp:

(WebCore::RenderBox::sizesToIntrinsicLogicalWidth):

  • rendering/RenderFlexibleBox.cpp:

(WebCore::alignmentForChild):
(WebCore::RenderFlexibleBox::layoutAndPlaceChildren):
(WebCore::RenderFlexibleBox::alignChildren):

  • rendering/style/RenderStyle.h:
  • rendering/style/RenderStyleConstants.h:
  • rendering/style/StyleFlexibleBoxData.cpp:

(WebCore::StyleFlexibleBoxData::StyleFlexibleBoxData):
(WebCore::StyleFlexibleBoxData::operator==):

  • rendering/style/StyleFlexibleBoxData.h:

(StyleFlexibleBoxData): Move member variables to StyleRareNonInheritedData
because these values will eventually apply to more than just flexbox.

  • rendering/style/StyleRareNonInheritedData.cpp:

(WebCore::StyleRareNonInheritedData::StyleRareNonInheritedData):
(WebCore::StyleRareNonInheritedData::operator==):

  • rendering/style/StyleRareNonInheritedData.h:

(StyleRareNonInheritedData):

LayoutTests:

Updated tests for new CSS property names.

  • css3/flexbox/align-absolute-child.html:
  • css3/flexbox/cross-axis-scrollbar.html:
  • css3/flexbox/css-properties-expected.txt:
  • css3/flexbox/css-properties.html:
  • css3/flexbox/flex-align-baseline.html:
  • css3/flexbox/flex-align-column.html:
  • css3/flexbox/flex-align-end.html:
  • css3/flexbox/flex-align-stretch.html:
  • css3/flexbox/flex-align-vertical-writing-mode.html:
  • css3/flexbox/flex-align.html:
  • css3/flexbox/line-wrapping.html:
  • css3/flexbox/multiline-align.html:
  • css3/flexbox/multiline-reverse-wrap-baseline.html:
  • css3/flexbox/orthogonal-flex-directions.html:
  • css3/flexbox/position-absolute-child.html:
  • css3/flexbox/true-centering.html:
Location:
trunk
Files:
58 edited

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/ChangeLog

    r119130 r119131  
     12012-05-31  Tony Chang  <tony@chromium.org>
     2
     3        rename flexbox CSS properties from flex-align and flex-item-align to align-items and align-self
     4        https://bugs.webkit.org/show_bug.cgi?id=87907
     5
     6        Reviewed by Ojan Vafai.
     7
     8        Updated tests for new CSS property names.
     9
     10        * css3/flexbox/align-absolute-child.html:
     11        * css3/flexbox/cross-axis-scrollbar.html:
     12        * css3/flexbox/css-properties-expected.txt:
     13        * css3/flexbox/css-properties.html:
     14        * css3/flexbox/flex-align-baseline.html:
     15        * css3/flexbox/flex-align-column.html:
     16        * css3/flexbox/flex-align-end.html:
     17        * css3/flexbox/flex-align-stretch.html:
     18        * css3/flexbox/flex-align-vertical-writing-mode.html:
     19        * css3/flexbox/flex-align.html:
     20        * css3/flexbox/line-wrapping.html:
     21        * css3/flexbox/multiline-align.html:
     22        * css3/flexbox/multiline-reverse-wrap-baseline.html:
     23        * css3/flexbox/orthogonal-flex-directions.html:
     24        * css3/flexbox/position-absolute-child.html:
     25        * css3/flexbox/true-centering.html:
     26
    1272012-05-31  Jessie Berlin  <jberlin@apple.com>
    228

  • trunk/LayoutTests/css3/flexbox/align-absolute-child.html

    r118818 r119131  
    1111}
    1212.align-center {
    13     -webkit-flex-align: center;
     13    -webkit-align-items: center;
    1414}
    1515.stretch {
    16     -webkit-flex-align: stretch;
     16    -webkit-align-items: stretch;
    1717}
    1818.relative {

  • trunk/LayoutTests/css3/flexbox/cross-axis-scrollbar.html

    r117385 r119131  
    5656<div style="position: absolute; top: 0; left: 0;">
    5757<div class="flexbox column" style="overflow-x: scroll; overflow-y: hidden; border-bottom: 10px solid green;">
    58     <div style="-webkit-flex-item-align: start"></div>
    59     <div style="-webkit-flex-item-align: center"></div>
    60     <div style="-webkit-flex-item-align: end"></div>
    61     <div style="-webkit-flex-item-align: baseline"></div>
    62     <div style="-webkit-flex-item-align: stretch"></div>
     58    <div style="-webkit-align-self: start"></div>
     59    <div style="-webkit-align-self: center"></div>
     60    <div style="-webkit-align-self: end"></div>
     61    <div style="-webkit-align-self: baseline"></div>
     62    <div style="-webkit-align-self: stretch"></div>
    6363</div>
    6464</div>
    … …  
    6666<div style="position: absolute; top: 0; left: 150px;">
    6767<div class="flexbox column" style="overflow-y: scroll; overflow-x: hidden; border-right: 10px solid green;">
    68     <div style="-webkit-flex-item-align: start"></div>
    69     <div style="-webkit-flex-item-align: center"></div>
    70     <div style="-webkit-flex-item-align: end"></div>
    71     <div style="-webkit-flex-item-align: baseline"></div>
    72     <div style="-webkit-flex-item-align: stretch"></div>
     68    <div style="-webkit-align-self: start"></div>
     69    <div style="-webkit-align-self: center"></div>
     70    <div style="-webkit-align-self: end"></div>
     71    <div style="-webkit-align-self: baseline"></div>
     72    <div style="-webkit-align-self: stretch"></div>
    7373</div>
    7474</div>
    … …  
    7676<div style="position: absolute; top:0; left: 300px" class="vertical-lr">
    7777<div class="flexbox column" style="overflow-y: scroll; overflow-x: hidden; border-right: 10px solid green;">
    78     <div style="-webkit-flex-item-align: start"></div>
    79     <div style="-webkit-flex-item-align: center"></div>
    80     <div style="-webkit-flex-item-align: end"></div>
    81     <div style="-webkit-flex-item-align: baseline"></div>
    82     <div style="-webkit-flex-item-align: start"></div>
     78    <div style="-webkit-align-self: start"></div>
     79    <div style="-webkit-align-self: center"></div>
     80    <div style="-webkit-align-self: end"></div>
     81    <div style="-webkit-align-self: baseline"></div>
     82    <div style="-webkit-align-self: start"></div>
    8383</div>
    8484</div>
    … …  
    8686<div style="position: absolute; top:0; left: 450px;" class="vertical-lr">
    8787<div class="flexbox column" style="overflow-x: scroll; overflow-y: hidden; border-bottom: 10px solid green;">
    88     <div style="-webkit-flex-item-align: start"></div>
    89     <div style="-webkit-flex-item-align: center"></div>
    90     <div style="-webkit-flex-item-align: end"></div>
    91     <div style="-webkit-flex-item-align: baseline"></div>
    92     <div style="-webkit-flex-item-align: start"></div>
     88    <div style="-webkit-align-self: start"></div>
     89    <div style="-webkit-align-self: center"></div>
     90    <div style="-webkit-align-self: end"></div>
     91    <div style="-webkit-align-self: baseline"></div>
     92    <div style="-webkit-align-self: start"></div>
    9393</div>
    9494</div>
    … …  
    9696<div style="height: 20px; width: 100px; position: absolute; top: 100px; left: 0">
    9797<div class="flexbox row" style="overflow-x: scroll; overflow-y: hidden; border-bottom: 10px solid green;">
    98     <div style="-webkit-flex-item-align: start"></div>
    99     <div style="-webkit-flex-item-align: center"></div>
    100     <div style="-webkit-flex-item-align: end"></div>
    101     <div style="-webkit-flex-item-align: baseline"></div>
    102     <div style="-webkit-flex-item-align: stretch"></div>
     98    <div style="-webkit-align-self: start"></div>
     99    <div style="-webkit-align-self: center"></div>
     100    <div style="-webkit-align-self: end"></div>
     101    <div style="-webkit-align-self: baseline"></div>
     102    <div style="-webkit-align-self: stretch"></div>
    103103</div>
    104104</div>
    … …  
    106106<div style="height: 20px; width: 100px; position: absolute; top: 100px; left: 150px">
    107107<div class="flexbox row" style="overflow-y: scroll; overflow-x: hidden; border-right: 10px solid green;">
    108     <div style="-webkit-flex-item-align: start"></div>
    109     <div style="-webkit-flex-item-align: center"></div>
    110     <div style="-webkit-flex-item-align: end"></div>
    111     <div style="-webkit-flex-item-align: baseline"></div>
    112     <div style="-webkit-flex-item-align: stretch"></div>
     108    <div style="-webkit-align-self: start"></div>
     109    <div style="-webkit-align-self: center"></div>
     110    <div style="-webkit-align-self: end"></div>
     111    <div style="-webkit-align-self: baseline"></div>
     112    <div style="-webkit-align-self: stretch"></div>
    113113</div>
    114114</div>
    … …  
    116116<div style="height: 50px; width: 50px; position: absolute; top: 100px; left: 300px" class="vertical-lr">
    117117<div class="flexbox row" style="overflow-x: scroll; overflow-y: hidden; border-bottom: 10px solid green;">
    118     <div style="-webkit-flex-item-align: start"></div>
    119     <div style="-webkit-flex-item-align: center"></div>
    120     <div style="-webkit-flex-item-align: end"></div>
    121     <div style="-webkit-flex-item-align: baseline"></div>
    122     <div style="-webkit-flex-item-align: stretch"></div>
     118    <div style="-webkit-align-self: start"></div>
     119    <div style="-webkit-align-self: center"></div>
     120    <div style="-webkit-align-self: end"></div>
     121    <div style="-webkit-align-self: baseline"></div>
     122    <div style="-webkit-align-self: stretch"></div>
    123123</div>
    124124</div>
    … …  
    126126<div style="height: 50px; width: 50px; position: absolute; top: 100px; left: 450px" class="vertical-lr">
    127127<div class="flexbox row" style="overflow-y: scroll; overflow-x: hidden; border-right: 10px solid green;">
    128     <div style="-webkit-flex-item-align: start"></div>
    129     <div style="-webkit-flex-item-align: center"></div>
    130     <div style="-webkit-flex-item-align: end"></div>
    131     <div style="-webkit-flex-item-align: baseline"></div>
    132     <div style="-webkit-flex-item-align: stretch"></div>
     128    <div style="-webkit-align-self: start"></div>
     129    <div style="-webkit-align-self: center"></div>
     130    <div style="-webkit-align-self: end"></div>
     131    <div style="-webkit-align-self: baseline"></div>
     132    <div style="-webkit-align-self: stretch"></div>
    133133</div>
    134134</div>

  • trunk/LayoutTests/css3/flexbox/css-properties-expected.txt

    r118971 r119131  
    2929PASS flexbox.style.webkitFlexPack is ""
    3030PASS window.getComputedStyle(flexbox, null).webkitFlexPack is "start"
    31 PASS flexbox.style.webkitFlexItemAlign is ""
    32 PASS window.getComputedStyle(flexbox, null).webkitFlexItemAlign is "stretch"
    33 PASS window.getComputedStyle(document.documentElement, null).webkitFlexItemAlign is "stretch"
    34 PASS flexbox.style.webkitFlexItemAlign is ""
    35 PASS flexbox.style.webkitFlexItemAlign is "auto"
    36 PASS window.getComputedStyle(flexbox, null).webkitFlexItemAlign is "stretch"
    37 PASS flexbox.style.webkitFlexItemAlign is "start"
    38 PASS window.getComputedStyle(flexbox, null).webkitFlexItemAlign is "start"
    39 PASS flexbox.style.webkitFlexItemAlign is "end"
    40 PASS window.getComputedStyle(flexbox, null).webkitFlexItemAlign is "end"
    41 PASS flexbox.style.webkitFlexItemAlign is "center"
    42 PASS window.getComputedStyle(flexbox, null).webkitFlexItemAlign is "center"
    43 PASS flexbox.style.webkitFlexItemAlign is "stretch"
    44 PASS window.getComputedStyle(flexbox, null).webkitFlexItemAlign is "stretch"
    45 PASS flexbox.style.webkitFlexItemAlign is "baseline"
    46 PASS window.getComputedStyle(flexbox, null).webkitFlexItemAlign is "baseline"
    47 PASS flexbox.style.webkitFlexItemAlign is ""
    48 PASS window.getComputedStyle(flexbox, null).webkitFlexItemAlign is "stretch"
    49 PASS flexbox.style.webkitFlexAlign is ""
    50 PASS window.getComputedStyle(flexbox, null).webkitFlexAlign is "stretch"
    51 PASS window.getComputedStyle(flexitem, null).webkitFlexItemAlign is "stretch"
    52 PASS flexbox.style.webkitFlexAlign is ""
    53 PASS flexbox.style.webkitFlexAlign is ""
    54 PASS window.getComputedStyle(flexbox, null).webkitFlexAlign is "stretch"
    55 PASS window.getComputedStyle(flexitem, null).webkitFlexItemAlign is "stretch"
    56 PASS flexbox.style.webkitFlexAlign is "start"
    57 PASS window.getComputedStyle(flexbox, null).webkitFlexAlign is "start"
    58 PASS window.getComputedStyle(flexitem, null).webkitFlexItemAlign is "start"
    59 PASS flexbox.style.webkitFlexAlign is "end"
    60 PASS window.getComputedStyle(flexbox, null).webkitFlexAlign is "end"
    61 PASS window.getComputedStyle(flexitem, null).webkitFlexItemAlign is "end"
    62 PASS flexbox.style.webkitFlexAlign is "center"
    63 PASS window.getComputedStyle(flexbox, null).webkitFlexAlign is "center"
    64 PASS window.getComputedStyle(flexitem, null).webkitFlexItemAlign is "center"
    65 PASS flexbox.style.webkitFlexAlign is "stretch"
    66 PASS window.getComputedStyle(flexbox, null).webkitFlexAlign is "stretch"
    67 PASS window.getComputedStyle(flexitem, null).webkitFlexItemAlign is "stretch"
    68 PASS flexbox.style.webkitFlexAlign is "baseline"
    69 PASS window.getComputedStyle(flexbox, null).webkitFlexAlign is "baseline"
    70 PASS window.getComputedStyle(flexitem, null).webkitFlexItemAlign is "baseline"
    71 PASS flexbox.style.webkitFlexAlign is ""
    72 PASS window.getComputedStyle(flexbox, null).webkitFlexAlign is "stretch"
    73 PASS window.getComputedStyle(flexitem, null).webkitFlexItemAlign is "stretch"
    74 PASS flexbox.style.webkitFlexAlign is ""
    75 PASS window.getComputedStyle(flexbox, null).webkitFlexAlign is "stretch"
    76 PASS window.getComputedStyle(flexitem, null).webkitFlexItemAlign is "stretch"
    77 PASS window.getComputedStyle(detachedFlexbox, null).webkitFlexItemAlign is ""
    78 PASS window.getComputedStyle(detachedFlexItem, null).webkitFlexItemAlign is ""
     31PASS flexbox.style.webkitAlignSelf is ""
     32PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "stretch"
     33PASS window.getComputedStyle(document.documentElement, null).webkitAlignSelf is "stretch"
     34PASS flexbox.style.webkitAlignSelf is ""
     35PASS flexbox.style.webkitAlignSelf is "auto"
     36PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "stretch"
     37PASS flexbox.style.webkitAlignSelf is "start"
     38PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "start"
     39PASS flexbox.style.webkitAlignSelf is "end"
     40PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "end"
     41PASS flexbox.style.webkitAlignSelf is "center"
     42PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "center"
     43PASS flexbox.style.webkitAlignSelf is "stretch"
     44PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "stretch"
     45PASS flexbox.style.webkitAlignSelf is "baseline"
     46PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "baseline"
     47PASS flexbox.style.webkitAlignSelf is ""
     48PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "stretch"
     49PASS flexbox.style.webkitAlignItems is ""
     50PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "stretch"
     51PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "stretch"
     52PASS flexbox.style.webkitAlignItems is ""
     53PASS flexbox.style.webkitAlignItems is ""
     54PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "stretch"
     55PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "stretch"
     56PASS flexbox.style.webkitAlignItems is "start"
     57PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "start"
     58PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "start"
     59PASS flexbox.style.webkitAlignItems is "end"
     60PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "end"
     61PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "end"
     62PASS flexbox.style.webkitAlignItems is "center"
     63PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "center"
     64PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "center"
     65PASS flexbox.style.webkitAlignItems is "stretch"
     66PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "stretch"
     67PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "stretch"
     68PASS flexbox.style.webkitAlignItems is "baseline"
     69PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "baseline"
     70PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "baseline"
     71PASS flexbox.style.webkitAlignItems is ""
     72PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "stretch"
     73PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "stretch"
     74PASS flexbox.style.webkitAlignItems is ""
     75PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "stretch"
     76PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "stretch"
     77PASS window.getComputedStyle(detachedFlexbox, null).webkitAlignSelf is ""
     78PASS window.getComputedStyle(detachedFlexItem, null).webkitAlignSelf is ""
    7979PASS flexbox.style.webkitFlexDirection is ""
    8080PASS window.getComputedStyle(flexbox, null).webkitFlexDirection is "row"

  • trunk/LayoutTests/css3/flexbox/css-properties.html

    r118971 r119131  
    8080
    8181
    82 shouldBeEqualToString('flexbox.style.webkitFlexItemAlign', '');
     82shouldBeEqualToString('flexbox.style.webkitAlignSelf', '');
    8383// The initial value is 'stretch'.
    84 shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitFlexItemAlign', 'stretch');
    85 shouldBeEqualToString('window.getComputedStyle(document.documentElement, null).webkitFlexItemAlign', 'stretch');
    86 
    87 flexbox.style.webkitFlexItemAlign = 'foo';
    88 shouldBeEqualToString('flexbox.style.webkitFlexItemAlign', '');
    89 
    90 flexbox.style.webkitFlexItemAlign = 'auto';
    91 shouldBeEqualToString('flexbox.style.webkitFlexItemAlign', 'auto');
    92 shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitFlexItemAlign', 'stretch');
    93 
    94 flexbox.style.webkitFlexItemAlign = 'start';
    95 shouldBeEqualToString('flexbox.style.webkitFlexItemAlign', 'start');
    96 shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitFlexItemAlign', 'start');
    97 
    98 flexbox.style.webkitFlexItemAlign = 'end';
    99 shouldBeEqualToString('flexbox.style.webkitFlexItemAlign', 'end');
    100 shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitFlexItemAlign', 'end');
    101 
    102 flexbox.style.webkitFlexItemAlign = 'center';
    103 shouldBeEqualToString('flexbox.style.webkitFlexItemAlign', 'center');
    104 shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitFlexItemAlign', 'center');
    105 
    106 flexbox.style.webkitFlexItemAlign = 'stretch';
    107 shouldBeEqualToString('flexbox.style.webkitFlexItemAlign', 'stretch');
    108 shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitFlexItemAlign', 'stretch');
    109 
    110 flexbox.style.webkitFlexItemAlign = 'baseline';
    111 shouldBeEqualToString('flexbox.style.webkitFlexItemAlign', 'baseline');
    112 shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitFlexItemAlign', 'baseline');
    113 
    114 flexbox.style.webkitFlexItemAlign = '';
    115 shouldBeEqualToString('flexbox.style.webkitFlexItemAlign', '');
    116 shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitFlexItemAlign', 'stretch');
    117 
    118 shouldBeEqualToString('flexbox.style.webkitFlexAlign', '');
     84shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignSelf', 'stretch');
     85shouldBeEqualToString('window.getComputedStyle(document.documentElement, null).webkitAlignSelf', 'stretch');
     86
     87flexbox.style.webkitAlignSelf = 'foo';
     88shouldBeEqualToString('flexbox.style.webkitAlignSelf', '');
     89
     90flexbox.style.webkitAlignSelf = 'auto';
     91shouldBeEqualToString('flexbox.style.webkitAlignSelf', 'auto');
     92shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignSelf', 'stretch');
     93
     94flexbox.style.webkitAlignSelf = 'start';
     95shouldBeEqualToString('flexbox.style.webkitAlignSelf', 'start');
     96shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignSelf', 'start');
     97
     98flexbox.style.webkitAlignSelf = 'end';
     99shouldBeEqualToString('flexbox.style.webkitAlignSelf', 'end');
     100shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignSelf', 'end');
     101
     102flexbox.style.webkitAlignSelf = 'center';
     103shouldBeEqualToString('flexbox.style.webkitAlignSelf', 'center');
     104shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignSelf', 'center');
     105
     106flexbox.style.webkitAlignSelf = 'stretch';
     107shouldBeEqualToString('flexbox.style.webkitAlignSelf', 'stretch');
     108shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignSelf', 'stretch');
     109
     110flexbox.style.webkitAlignSelf = 'baseline';
     111shouldBeEqualToString('flexbox.style.webkitAlignSelf', 'baseline');
     112shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignSelf', 'baseline');
     113
     114flexbox.style.webkitAlignSelf = '';
     115shouldBeEqualToString('flexbox.style.webkitAlignSelf', '');
     116shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignSelf', 'stretch');
     117
     118shouldBeEqualToString('flexbox.style.webkitAlignItems', '');
    119119// The initial value is 'stretch'.
    120 shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitFlexAlign', 'stretch');
    121 shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitFlexItemAlign', 'stretch');
    122 
    123 flexbox.style.webkitFlexAlign = 'foo';
    124 shouldBeEqualToString('flexbox.style.webkitFlexAlign', '');
    125 
    126 flexbox.style.webkitFlexAlign = 'auto';
    127 shouldBeEqualToString('flexbox.style.webkitFlexAlign', '');
    128 shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitFlexAlign', 'stretch');
    129 shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitFlexItemAlign', 'stretch');
    130 
    131 flexbox.style.webkitFlexAlign = 'start';
    132 shouldBeEqualToString('flexbox.style.webkitFlexAlign', 'start');
    133 shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitFlexAlign', 'start');
    134 shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitFlexItemAlign', 'start');
    135 
    136 flexbox.style.webkitFlexAlign = 'end';
    137 shouldBeEqualToString('flexbox.style.webkitFlexAlign', 'end');
    138 shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitFlexAlign', 'end');
    139 shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitFlexItemAlign', 'end');
    140 
    141 flexbox.style.webkitFlexAlign = 'center';
    142 shouldBeEqualToString('flexbox.style.webkitFlexAlign', 'center');
    143 shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitFlexAlign', 'center');
    144 shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitFlexItemAlign', 'center');
    145 
    146 flexbox.style.webkitFlexAlign = 'stretch';
    147 shouldBeEqualToString('flexbox.style.webkitFlexAlign', 'stretch');
    148 shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitFlexAlign', 'stretch');
    149 shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitFlexItemAlign', 'stretch');
    150 
    151 flexbox.style.webkitFlexAlign = 'baseline';
    152 shouldBeEqualToString('flexbox.style.webkitFlexAlign', 'baseline');
    153 shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitFlexAlign', 'baseline');
    154 shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitFlexItemAlign', 'baseline');
    155 
    156 flexbox.style.webkitFlexAlign = '';
    157 shouldBeEqualToString('flexbox.style.webkitFlexAlign', '');
    158 shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitFlexAlign', 'stretch');
    159 shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitFlexItemAlign', 'stretch');
     120shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignItems', 'stretch');
     121shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf', 'stretch');
     122
     123flexbox.style.webkitAlignItems = 'foo';
     124shouldBeEqualToString('flexbox.style.webkitAlignItems', '');
     125
     126flexbox.style.webkitAlignItems = 'auto';
     127shouldBeEqualToString('flexbox.style.webkitAlignItems', '');
     128shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignItems', 'stretch');
     129shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf', 'stretch');
     130
     131flexbox.style.webkitAlignItems = 'start';
     132shouldBeEqualToString('flexbox.style.webkitAlignItems', 'start');
     133shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignItems', 'start');
     134shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf', 'start');
     135
     136flexbox.style.webkitAlignItems = 'end';
     137shouldBeEqualToString('flexbox.style.webkitAlignItems', 'end');
     138shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignItems', 'end');
     139shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf', 'end');
     140
     141flexbox.style.webkitAlignItems = 'center';
     142shouldBeEqualToString('flexbox.style.webkitAlignItems', 'center');
     143shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignItems', 'center');
     144shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf', 'center');
     145
     146flexbox.style.webkitAlignItems = 'stretch';
     147shouldBeEqualToString('flexbox.style.webkitAlignItems', 'stretch');
     148shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignItems', 'stretch');
     149shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf', 'stretch');
     150
     151flexbox.style.webkitAlignItems = 'baseline';
     152shouldBeEqualToString('flexbox.style.webkitAlignItems', 'baseline');
     153shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignItems', 'baseline');
     154shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf', 'baseline');
     155
     156flexbox.style.webkitAlignItems = '';
     157shouldBeEqualToString('flexbox.style.webkitAlignItems', '');
     158shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignItems', 'stretch');
     159shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf', 'stretch');
    160160
    161161flexbox.style.display = 'none';
    162 shouldBeEqualToString('flexbox.style.webkitFlexAlign', '');
    163 shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitFlexAlign', 'stretch');
    164 shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitFlexItemAlign', 'stretch');
     162shouldBeEqualToString('flexbox.style.webkitAlignItems', '');
     163shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignItems', 'stretch');
     164shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf', 'stretch');
    165165flexbox.style.display = '';
    166166
    … …  
    170170var detachedFlexItem = document.createElement('div');
    171171detachedFlexbox.appendChild(detachedFlexItem);
    172 shouldBeEqualToString('window.getComputedStyle(detachedFlexbox, null).webkitFlexItemAlign', '');
    173 shouldBeEqualToString('window.getComputedStyle(detachedFlexItem, null).webkitFlexItemAlign', '');
     172shouldBeEqualToString('window.getComputedStyle(detachedFlexbox, null).webkitAlignSelf', '');
     173shouldBeEqualToString('window.getComputedStyle(detachedFlexItem, null).webkitAlignSelf', '');
    174174
    175175

  • trunk/LayoutTests/css3/flexbox/flex-align-baseline.html

    r117385 r119131  
    7777
    7878            var container = document.createElement('div');
    79             container.innerHTML = '<div class="flexbox ' + flexboxClassName + '" style="-webkit-flex-align: baseline;">' +
     79            container.innerHTML = '<div class="flexbox ' + flexboxClassName + '" style="-webkit-align-items: baseline;">' +
    8080                '<div><div style="display:inline-block;"></div></div>' +
    8181                '<div style="margin-top:20px;"><div style="display:inline-block;"></div></div>' +
    … …  
    8888})
    8989
    90 // Sanity check that the flex-align:baseline flex items align to the same cross-axis position.
     90// Sanity check that the align-items:baseline flex items align to the same cross-axis position.
    9191var flexboxen = document.getElementsByClassName('flexbox');
    9292for (var i = 0, len = flexboxen.length; i < len; i++) {

  • trunk/LayoutTests/css3/flexbox/flex-align-column.html

    r117385 r119131  
    4747<div class="flexbox">
    4848    <div data-offset-x=0 data-expected-width=600 data-expected-height=40 style="-webkit-flex: 1;"></div>
    49     <div data-offset-x=0 data-expected-width=600 data-expected-height=40 style="-webkit-flex: 1; -webkit-flex-item-align: stretch; "></div>
    50     <div data-offset-x=0 data-expected-width=20 data-expected-height=40 style="-webkit-flex: 1; -webkit-flex-item-align: start; width: 20px;"></div>
    51     <div data-offset-x=580 data-expected-width=20 data-expected-height=40 style="-webkit-flex: 1; -webkit-flex-item-align: end; width: 20px;"></div>
    52     <div data-offset-x=290 data-expected-width=20 data-expected-height=40 style="-webkit-flex: 1; -webkit-flex-item-align: center; width: 20px;"></div>
    53     <div data-offset-x=0 data-expected-width=20 data-expected-height=40 style="-webkit-flex: 1; -webkit-flex-item-align: baseline; width: 20px;"></div>
     49    <div data-offset-x=0 data-expected-width=600 data-expected-height=40 style="-webkit-flex: 1; -webkit-align-self: stretch; "></div>
     50    <div data-offset-x=0 data-expected-width=20 data-expected-height=40 style="-webkit-flex: 1; -webkit-align-self: start; width: 20px;"></div>
     51    <div data-offset-x=580 data-expected-width=20 data-expected-height=40 style="-webkit-flex: 1; -webkit-align-self: end; width: 20px;"></div>
     52    <div data-offset-x=290 data-expected-width=20 data-expected-height=40 style="-webkit-flex: 1; -webkit-align-self: center; width: 20px;"></div>
     53    <div data-offset-x=0 data-expected-width=20 data-expected-height=40 style="-webkit-flex: 1; -webkit-align-self: baseline; width: 20px;"></div>
    5454</div>
    5555
    5656<div class="flexbox vertical">
    5757    <div data-offset-y=0 data-expected-width=100 data-expected-height=240 style="-webkit-flex: 1;"></div>
    58     <div data-offset-y=0 data-expected-width=100 data-expected-height=240 style="-webkit-flex: 1; -webkit-flex-item-align: stretch; "></div>
    59     <div data-offset-y=0 data-expected-width=100 data-expected-height=20 style="-webkit-flex: 1; -webkit-flex-item-align: start; height: 20px;"></div>
    60     <div data-offset-y=220 data-expected-width=100 data-expected-height=20 style="-webkit-flex: 1; -webkit-flex-item-align: end; height: 20px;"></div>
    61     <div data-offset-y=110 data-expected-width=100 data-expected-height=20 style="-webkit-flex: 1; -webkit-flex-item-align: center; height: 20px;"></div>
    62     <div data-offset-y=0 data-expected-width=100 data-expected-height=20 style="-webkit-flex: 1; -webkit-flex-item-align: baseline; height: 20px;"></div>
     58    <div data-offset-y=0 data-expected-width=100 data-expected-height=240 style="-webkit-flex: 1; -webkit-align-self: stretch; "></div>
     59    <div data-offset-y=0 data-expected-width=100 data-expected-height=20 style="-webkit-flex: 1; -webkit-align-self: start; height: 20px;"></div>
     60    <div data-offset-y=220 data-expected-width=100 data-expected-height=20 style="-webkit-flex: 1; -webkit-align-self: end; height: 20px;"></div>
     61    <div data-offset-y=110 data-expected-width=100 data-expected-height=20 style="-webkit-flex: 1; -webkit-align-self: center; height: 20px;"></div>
     62    <div data-offset-y=0 data-expected-width=100 data-expected-height=20 style="-webkit-flex: 1; -webkit-align-self: baseline; height: 20px;"></div>
    6363</div>
    6464

  • trunk/LayoutTests/css3/flexbox/flex-align-end.html

    r117385 r119131  
    107107
    108108            var container = document.createElement('div');
    109             container.innerHTML = '<div class="flexbox ' + flexboxClassName + '" style="-webkit-flex-align: end;">\n' +
     109            container.innerHTML = '<div class="flexbox ' + flexboxClassName + '" style="-webkit-align-items: end;">\n' +
    110110                '<div ' + positionAsString(expectations[writingMode][flexFlow][direction]) + '></div><div></div>\n' +
    111111            '</div>';

  • trunk/LayoutTests/css3/flexbox/flex-align-stretch.html

    r117385 r119131  
    8383</div>
    8484
    85 <!-- When overflowing the height, flex-align: stretch doesn't cause the flex item to get smaller. -->
     85<!-- When overflowing the height, align-items: stretch doesn't cause the flex item to get smaller. -->
    8686<div class="flexbox" style="height: 50px; width: 600px;">
    8787  <div data-expected-height="60" style="background-color: yellow; width: 300px">
    … …  
    9090</div>
    9191
    92 <!-- In the column case, the width of the flex item is constrained by the width of the flexbox, so flex-align: stretch doesn't change the width. -->
     92<!-- In the column case, the width of the flex item is constrained by the width of the flexbox, so align-items: stretch doesn't change the width. -->
    9393<div class="flexbox" style="-webkit-flex-direction: column; width: 100px;">
    9494  <div data-expected-width="100" data-expected-height="50" style="background-color: yellow;">

  • trunk/LayoutTests/css3/flexbox/flex-align-vertical-writing-mode.html

    r118279 r119131  
    5757<body onload="checkFlexBoxen()">
    5858
    59 <!-- stretch is the default flex-align so these flexitems should all have the same height. -->
     59<!-- stretch is the default align-items so these flexitems should all have the same height. -->
    6060<div class="flexbox">
    6161  <div data-expected-width="100" style="-webkit-flex: 1 0 0;"></div>
    … …  
    9292
    9393<div class="flexbox">
    94   <div data-expected-width="0" data-offset-x="100" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: start;"></div>
    95   <div data-expected-width="50" data-offset-x="50" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: start; width: 50px;"></div>
    96   <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: start; width: 50px; margin: 0 auto"></div>
    97   <div data-expected-width="50" data-offset-x="50" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: start; width: 50px; margin: 0 auto 0 0"></div>
    98   <div data-expected-width="50" data-offset-x="0" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: start; width: 50px; margin: 0 0 0 auto"></div>
    99   <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: start; width: 50px; margin: 0 25px"></div>
    100   <div data-expected-width="50" data-offset-x="30" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: start; width: 50px; margin: 0 20px 0 10px;"></div>
    101   <div data-expected-width="100" data-offset-x="0" style="-webkit-flex: 1 0 0; width: 100px;"></div>
    102 </div>
    103 
    104 <div class="flexbox">
    105   <div data-expected-width="0" data-offset-x="0" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: end;"></div>
    106   <div data-expected-width="50" data-offset-x="0" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: end; width: 50px;"></div>
    107   <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: end; width: 50px; margin: 0 auto"></div>
    108   <div data-expected-width="50" data-offset-x="50" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: end; width: 50px; margin: 0 auto 0 0"></div>
    109   <div data-expected-width="50" data-offset-x="0" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: end; width: 50px; margin: 0 0 0 auto"></div>
    110   <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: end; width: 50px; margin: 0 25px"></div>
    111   <div data-expected-width="50" data-offset-x="10" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: end; width: 50px; margin: 0 20px 0 10px;"></div>
    112   <div data-expected-width="100" data-offset-x="0" style="-webkit-flex: 1 0 0; width: 100px;"></div>
    113 </div>
    114 
    115 <div class="flexbox">
    116   <div data-expected-width="0" data-offset-x="50" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center;"></div>
    117   <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center; width: 50px;"></div>
    118   <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center; width: 50px; margin: 0 auto"></div>
    119   <div data-expected-width="50" data-offset-x="50" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center; width: 50px; margin: 0 auto 0 0"></div>
    120   <div data-expected-width="50" data-offset-x="0" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center; width: 50px; margin: 0 0 0 auto"></div>
    121   <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center; width: 50px; margin: 0 25px"></div>
    122   <div data-expected-width="50" data-offset-x="20" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center; width: 50px; margin: 0 20px 0 10px;"></div>
    123   <div data-expected-width="100" data-offset-x="0" style="-webkit-flex: 1 0 0; width: 100px;"></div>
    124 </div>
    125 
    126 <div class="flexbox">
    127   <div data-expected-width="50" data-offset-x="50" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: start; width: 50px;"></div>
    128   <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center; width: 50px;"></div>
    129   <div data-expected-width="50" data-offset-x="0" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: end; width: 50px;"></div>
     94  <div data-expected-width="0" data-offset-x="100" style="-webkit-flex: 1 0 0; -webkit-align-self: start;"></div>
     95  <div data-expected-width="50" data-offset-x="50" style="-webkit-flex: 1 0 0; -webkit-align-self: start; width: 50px;"></div>
     96  <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-align-self: start; width: 50px; margin: 0 auto"></div>
     97  <div data-expected-width="50" data-offset-x="50" style="-webkit-flex: 1 0 0; -webkit-align-self: start; width: 50px; margin: 0 auto 0 0"></div>
     98  <div data-expected-width="50" data-offset-x="0" style="-webkit-flex: 1 0 0; -webkit-align-self: start; width: 50px; margin: 0 0 0 auto"></div>
     99  <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-align-self: start; width: 50px; margin: 0 25px"></div>
     100  <div data-expected-width="50" data-offset-x="30" style="-webkit-flex: 1 0 0; -webkit-align-self: start; width: 50px; margin: 0 20px 0 10px;"></div>
     101  <div data-expected-width="100" data-offset-x="0" style="-webkit-flex: 1 0 0; width: 100px;"></div>
     102</div>
     103
     104<div class="flexbox">
     105  <div data-expected-width="0" data-offset-x="0" style="-webkit-flex: 1 0 0; -webkit-align-self: end;"></div>
     106  <div data-expected-width="50" data-offset-x="0" style="-webkit-flex: 1 0 0; -webkit-align-self: end; width: 50px;"></div>
     107  <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-align-self: end; width: 50px; margin: 0 auto"></div>
     108  <div data-expected-width="50" data-offset-x="50" style="-webkit-flex: 1 0 0; -webkit-align-self: end; width: 50px; margin: 0 auto 0 0"></div>
     109  <div data-expected-width="50" data-offset-x="0" style="-webkit-flex: 1 0 0; -webkit-align-self: end; width: 50px; margin: 0 0 0 auto"></div>
     110  <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-align-self: end; width: 50px; margin: 0 25px"></div>
     111  <div data-expected-width="50" data-offset-x="10" style="-webkit-flex: 1 0 0; -webkit-align-self: end; width: 50px; margin: 0 20px 0 10px;"></div>
     112  <div data-expected-width="100" data-offset-x="0" style="-webkit-flex: 1 0 0; width: 100px;"></div>
     113</div>
     114
     115<div class="flexbox">
     116  <div data-expected-width="0" data-offset-x="50" style="-webkit-flex: 1 0 0; -webkit-align-self: center;"></div>
     117  <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-align-self: center; width: 50px;"></div>
     118  <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-align-self: center; width: 50px; margin: 0 auto"></div>
     119  <div data-expected-width="50" data-offset-x="50" style="-webkit-flex: 1 0 0; -webkit-align-self: center; width: 50px; margin: 0 auto 0 0"></div>
     120  <div data-expected-width="50" data-offset-x="0" style="-webkit-flex: 1 0 0; -webkit-align-self: center; width: 50px; margin: 0 0 0 auto"></div>
     121  <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-align-self: center; width: 50px; margin: 0 25px"></div>
     122  <div data-expected-width="50" data-offset-x="20" style="-webkit-flex: 1 0 0; -webkit-align-self: center; width: 50px; margin: 0 20px 0 10px;"></div>
     123  <div data-expected-width="100" data-offset-x="0" style="-webkit-flex: 1 0 0; width: 100px;"></div>
     124</div>
     125
     126<div class="flexbox">
     127  <div data-expected-width="50" data-offset-x="50" style="-webkit-flex: 1 0 0; -webkit-align-self: start; width: 50px;"></div>
     128  <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-align-self: center; width: 50px;"></div>
     129  <div data-expected-width="50" data-offset-x="0" style="-webkit-flex: 1 0 0; -webkit-align-self: end; width: 50px;"></div>
    130130  <div data-expected-width="50" data-offset-x="50" style="-webkit-flex: 1 0 0; width: 50px; margin: auto 0"></div>
    131131  <div data-expected-width="100" data-offset-x="0" style="-webkit-flex: 1 0 0;"></div>
    … …  
    134134
    135135<div class="flexbox">
    136   <div data-expected-width="50" data-offset-x="50" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: start; width: 50px; -webkit-writing-mode: horizontal-tb;"></div>
    137   <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center; width: 50px; -webkit-writing-mode: horizontal-tb;"></div>
    138   <div data-expected-width="50" data-offset-x="0" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: end; width: 50px; -webkit-writing-mode: horizontal-tb;"></div>
     136  <div data-expected-width="50" data-offset-x="50" style="-webkit-flex: 1 0 0; -webkit-align-self: start; width: 50px; -webkit-writing-mode: horizontal-tb;"></div>
     137  <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-align-self: center; width: 50px; -webkit-writing-mode: horizontal-tb;"></div>
     138  <div data-expected-width="50" data-offset-x="0" style="-webkit-flex: 1 0 0; -webkit-align-self: end; width: 50px; -webkit-writing-mode: horizontal-tb;"></div>
    139139  <div data-expected-width="50" data-offset-x="50" style="-webkit-flex: 1 0 0; width: 50px; margin: auto 0; -webkit-writing-mode: horizontal-tb;"></div>
    140140  <div data-expected-width="100" data-offset-x="0" style="-webkit-flex: 1 0 0; width: 100px; -webkit-writing-mode: horizontal-tb;"></div>
    … …  
    142142
    143143<div class="flexbox">
    144   <div data-expected-width="20" data-offset-x="60" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline; width: 20px;"></div>
    145   <div data-expected-width="10" data-offset-x="70" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline; width: 10px; margin: 0 20px 0 10px;"></div>
    146   <div data-expected-width="10" data-offset-x="60" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline; width: 10px; margin: 0 20px 0 0;"></div>
    147   <div data-expected-width="100" data-offset-x="0" style="-webkit-flex: 1 0 0; width: 100px;"></div>
    148 </div>
    149 
    150 <div class="flexbox">
    151   <div id="baseline1" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline;">ahem</div>
    152   <div id="baseline2" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline;"><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px;"></div>
    153   <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center;"><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px; vertical-align: middle"></div>
    154   <div id="baseline3" data-expected-width="50" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline;"><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px; vertical-align: middle"></div>
    155   <div data-expected-width="100" data-offset-x="0" style="-webkit-flex: 1 0 0; width: 100px;"></div>
    156 </div>
    157 
    158 <div class="flexbox">
    159   <div id="baseline4" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline;">ahem</div>
    160   <div id="baseline5" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline;"><br><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px;"></div>
    161   <div data-expected-width="50" data-offset-x="50" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline;"><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px; vertical-align: middle"></div>
     144  <div data-expected-width="20" data-offset-x="60" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline; width: 20px;"></div>
     145  <div data-expected-width="10" data-offset-x="70" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline; width: 10px; margin: 0 20px 0 10px;"></div>
     146  <div data-expected-width="10" data-offset-x="60" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline; width: 10px; margin: 0 20px 0 0;"></div>
     147  <div data-expected-width="100" data-offset-x="0" style="-webkit-flex: 1 0 0; width: 100px;"></div>
     148</div>
     149
     150<div class="flexbox">
     151  <div id="baseline1" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline;">ahem</div>
     152  <div id="baseline2" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline;"><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px;"></div>
     153  <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-align-self: center;"><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px; vertical-align: middle"></div>
     154  <div id="baseline3" data-expected-width="50" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline;"><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px; vertical-align: middle"></div>
     155  <div data-expected-width="100" data-offset-x="0" style="-webkit-flex: 1 0 0; width: 100px;"></div>
     156</div>
     157
     158<div class="flexbox">
     159  <div id="baseline4" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline;">ahem</div>
     160  <div id="baseline5" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline;"><br><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px;"></div>
     161  <div data-expected-width="50" data-offset-x="50" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline;"><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px; vertical-align: middle"></div>
    162162  <div data-expected-width="100" data-offset-x="0" style="-webkit-flex: 1 0 0; width: 100px;"></div>
    163163</div>
    164164
    165165<div class="flexbox" style="-webkit-writing-mode: vertical-lr">
    166   <div id="baseline6" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline;">ahem</div>
    167   <div id="baseline7" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline;"><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px;"></div>
    168   <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center;"><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px; vertical-align: middle"></div>
    169   <div data-expected-width="50" data-offset-x="0" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline;"><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px; vertical-align: middle"></div>
     166  <div id="baseline6" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline;">ahem</div>
     167  <div id="baseline7" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline;"><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px;"></div>
     168  <div data-expected-width="50" data-offset-x="25" style="-webkit-flex: 1 0 0; -webkit-align-self: center;"><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px; vertical-align: middle"></div>
     169  <div data-expected-width="50" data-offset-x="0" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline;"><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px; vertical-align: middle"></div>
    170170  <div data-expected-width="100" data-offset-x="0" style="-webkit-flex: 1 0 0; width: 100px;"></div>
    171171</div>
    172172
    173173<div class="flexbox" style="-webkit-writing-mode: vertical-lr">
    174   <div id="baseline8" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline;">ahem</div>
    175   <div id="baseline9" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline;"><br><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px;"></div>
    176   <div data-expected-width="50" data-offset-x="0" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline;"><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px; vertical-align: middle"></div>
     174  <div id="baseline8" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline;">ahem</div>
     175  <div id="baseline9" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline;"><br><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px;"></div>
     176  <div data-expected-width="50" data-offset-x="0" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline;"><img src="../../fast/replaced/resources/1x1-blue.png" style="width: 50px; vertical-align: middle"></div>
    177177  <div data-expected-width="100" data-offset-x="0" style="-webkit-flex: 1 0 0; width: 100px;"></div>
    178178</div>
    … …  
    189189               "baseline1 and baseline2 should have the same baseline.");
    190190    logIfFalse(baseline3.offsetLeft + baseline3.offsetWidth > 75,
    191                "baseline3 should be above the center flex-aligned item.");
     191               "baseline3 should be above the center align-itemsed item.");
    192192
    193193    var baseline4 = document.getElementById("baseline4");

  • trunk/LayoutTests/css3/flexbox/flex-align.html

    r118279 r119131  
    5656<body onload="checkFlexBoxen()">
    5757
    58 <!-- stretch is the default flex-align so these flexitems should all have the same height. -->
     58<!-- stretch is the default align-items so these flexitems should all have the same height. -->
    5959<div class="flexbox">
    6060  <div data-expected-height="100" style="-webkit-flex: 1 0 0;"></div>
    … …  
    7878</div>
    7979
    80 <div class="flexbox" style="-webkit-flex-align: start">
     80<div class="flexbox" style="-webkit-align-items: start">
    8181    <div data-expected-height="0" data-offset-y="0" style="-webkit-flex: 1 0 0;"></div>
    8282    <div data-expected-height="100" data-offset-y="0" style="-webkit-flex: 1 0 0; height: 100px;"></div>
    8383</div>
    8484
    85 <div class="flexbox" style="-webkit-flex-align: end">
     85<div class="flexbox" style="-webkit-align-items: end">
    8686    <div data-expected-height="0" data-offset-y="100" style="-webkit-flex: 1 0 0;"></div>
    8787    <div data-expected-height="100" data-offset-y="0" style="-webkit-flex: 1 0 0; height: 100px;"></div>
    8888</div>
    8989
    90 <div class="flexbox" style="-webkit-flex-align: center">
     90<div class="flexbox" style="-webkit-align-items: center">
    9191    <div data-expected-height="0" data-offset-y="50" style="-webkit-flex: 1 0 0;"></div>
    9292    <div data-expected-height="100" data-offset-y="0" style="-webkit-flex: 1 0 0; height: 100px;"></div>
    9393</div>
    9494
    95 <div class="flexbox" style="-webkit-flex-align: baseline">
     95<div class="flexbox" style="-webkit-align-items: baseline">
    9696    <div style="-webkit-flex: 1 0 0;"><div style="display:inline-block;"></div></div>
    9797    <div data-expected-height="100" data-offset-y="0" style="-webkit-flex: 1 0 0; height: 100px;"></div>
    9898</div>
    9999
    100 <div class="flexbox" style="-webkit-flex-align: stretch">
     100<div class="flexbox" style="-webkit-align-items: stretch">
    101101    <div data-expected-height="100" data-offset-y="0" style="-webkit-flex: 1 0 0;"></div>
    102102    <div data-expected-height="100" data-offset-y="0" style="-webkit-flex: 1 0 0; height: 100px;"></div>
    103103</div>
    104104
    105 <div class="flexbox" style="-webkit-flex-align: start">
    106     <div data-expected-height="100" data-offset-y="0" style="-webkit-flex-item-align: auto; -webkit-flex: 1 0 0; height: 100px;"></div>
    107     <div data-expected-height="0" data-offset-y="0" style="-webkit-flex-item-align: auto; -webkit-flex: 1 0 0;"></div>
    108     <div data-expected-height="0" data-offset-y="0" style="-webkit-flex-item-align: start; -webkit-flex: 1 0 0;"></div>
    109     <div data-expected-height="0" data-offset-y="100" style="-webkit-flex-item-align: end; -webkit-flex: 1 0 0;"></div>
    110     <div data-expected-height="0" data-offset-y="50" style="-webkit-flex-item-align: center; -webkit-flex: 1 0 0;"></div>
    111     <div data-offset-y="20" style="-webkit-flex-item-align: baseline; -webkit-flex: 1 0 0;"><div style="display:inline-block;"></div></div>
    112     <div data-offset-y="20" style="-webkit-flex-item-align: baseline; -webkit-flex: 1 0 0; margin: 20px;"><div style="display:inline-block;"></div></div>
    113     <div data-offset-y="50" style="-webkit-flex-item-align: baseline; -webkit-flex: 1 0 0; margin: auto 0;"></div>
    114     <div data-offset-y="30" style="-webkit-flex-item-align: baseline; -webkit-flex: 1 0 0; margin: 30px 0 auto;"><div style="display:inline-block;"></div></div>
    115     <div data-offset-y="80" style="-webkit-flex-item-align: baseline; -webkit-flex: 1 0 0; margin: auto 0 20px;"></div>
    116     <div data-expected-height="100" data-offset-y="0" style="-webkit-flex-item-align: stretch; -webkit-flex: 1 0 0;"></div>
    117 </div>
    118 
    119 <div class="flexbox" style="-webkit-flex-align: end">
    120     <div data-expected-height="100" data-offset-y="0" style="-webkit-flex-item-align: auto; -webkit-flex: 1 0 0; height: 100px;"></div>
    121     <div data-expected-height="0" data-offset-y="100" style="-webkit-flex-item-align: auto; -webkit-flex: 1 0 0;"></div>
    122     <div data-expected-height="0" data-offset-y="0" style="-webkit-flex-item-align: start; -webkit-flex: 1 0 0;"></div>
    123     <div data-expected-height="0" data-offset-y="100" style="-webkit-flex-item-align: end; -webkit-flex: 1 0 0;"></div>
    124     <div data-expected-height="0" data-offset-y="50" style="-webkit-flex-item-align: center; -webkit-flex: 1 0 0;"></div>
    125     <div data-offset-y="20" style="-webkit-flex-item-align: baseline; -webkit-flex: 1 0 0;"><div style="display:inline-block;"></div></div>
    126     <div data-offset-y="20" style="-webkit-flex-item-align: baseline; -webkit-flex: 1 0 0; margin: 20px;"><div style="display:inline-block;"></div></div>
    127     <div data-expected-height="100" data-offset-y="0" style="-webkit-flex-item-align: stretch; -webkit-flex: 1 0 0;"></div>
    128 </div>
    129 
    130 <div class="flexbox" style="-webkit-flex-align: center">
    131     <div data-expected-height="100" data-offset-y="0" style="-webkit-flex-item-align: auto; -webkit-flex: 1 0 0; height: 100px;"></div>
    132     <div data-expected-height="0" data-offset-y="50" style="-webkit-flex-item-align: auto; -webkit-flex: 1 0 0;"></div>
    133     <div data-expected-height="0" data-offset-y="0" style="-webkit-flex-item-align: start; -webkit-flex: 1 0 0;"></div>
    134     <div data-expected-height="0" data-offset-y="100" style="-webkit-flex-item-align: end; -webkit-flex: 1 0 0;"></div>
    135     <div data-expected-height="0" data-offset-y="50" style="-webkit-flex-item-align: center; -webkit-flex: 1 0 0;"></div>
    136     <div data-offset-y="20" style="-webkit-flex-item-align: baseline; -webkit-flex: 1 0 0;"><div style="display:inline-block;"></div></div>
    137     <div data-offset-y="20" style="-webkit-flex-item-align: baseline; -webkit-flex: 1 0 0; margin: 20px;"><div style="display:inline-block;"></div></div>
    138     <div data-expected-height="100" data-offset-y="0" style="-webkit-flex-item-align: stretch; -webkit-flex: 1 0 0;"></div>
    139 </div>
    140 
    141 <div class="flexbox" style="-webkit-flex-align: baseline">
    142     <div data-expected-height="100" data-offset-y="0" style="-webkit-flex-item-align: start; -webkit-flex: 1 0 0; height: 100px;"></div>
    143     <div data-offset-y="20" style="-webkit-flex-item-align: auto; -webkit-flex: 1 0 0;"><div style="display:inline-block;"></div></div>
    144     <div data-expected-height="0" data-offset-y="0" style="-webkit-flex-item-align: start; -webkit-flex: 1 0 0;"></div>
    145     <div data-expected-height="0" data-offset-y="100" style="-webkit-flex-item-align: end; -webkit-flex: 1 0 0;"></div>
    146     <div data-expected-height="0" data-offset-y="50" style="-webkit-flex-item-align: center; -webkit-flex: 1 0 0;"></div>
    147     <div data-offset-y="20" style="-webkit-flex-item-align: baseline; -webkit-flex: 1 0 0;"><div style="display:inline-block;"></div></div>
    148     <div data-offset-y="20" style="-webkit-flex-item-align: baseline; -webkit-flex: 1 0 0; margin: 20px;"><div style="display:inline-block;"></div></div>
    149     <div data-expected-height="100" data-offset-y="0" style="-webkit-flex-item-align: stretch; -webkit-flex: 1 0 0;"></div>
    150 </div>
    151 
    152 <div class="flexbox" style="-webkit-flex-align: stretch">
    153     <div data-expected-height="100" data-offset-y="0" style="-webkit-flex-item-align: auto; -webkit-flex: 1 0 0; height: 100px;"></div>
    154     <div data-expected-height="100" data-offset-y="0" style="-webkit-flex-item-align: auto; -webkit-flex: 1 0 0;"></div>
    155     <div data-expected-height="0" data-offset-y="0" style="-webkit-flex-item-align: start; -webkit-flex: 1 0 0;"></div>
    156     <div data-expected-height="0" data-offset-y="100" style="-webkit-flex-item-align: end; -webkit-flex: 1 0 0;"></div>
    157     <div data-expected-height="0" data-offset-y="50" style="-webkit-flex-item-align: center; -webkit-flex: 1 0 0;"></div>
    158     <div data-offset-y="20" style="-webkit-flex-item-align: baseline; -webkit-flex: 1 0 0;"><div style="display:inline-block;"></div></div>
    159     <div data-offset-y="20" style="-webkit-flex-item-align: baseline; -webkit-flex: 1 0 0; margin: 20px;"><div style="display:inline-block;"></div></div>
    160     <div data-expected-height="100" data-offset-y="0" style="-webkit-flex-item-align: stretch; -webkit-flex: 1 0 0;"></div>
     105<div class="flexbox" style="-webkit-align-items: start">
     106    <div data-expected-height="100" data-offset-y="0" style="-webkit-align-self: auto; -webkit-flex: 1 0 0; height: 100px;"></div>
     107    <div data-expected-height="0" data-offset-y="0" style="-webkit-align-self: auto; -webkit-flex: 1 0 0;"></div>
     108    <div data-expected-height="0" data-offset-y="0" style="-webkit-align-self: start; -webkit-flex: 1 0 0;"></div>
     109    <div data-expected-height="0" data-offset-y="100" style="-webkit-align-self: end; -webkit-flex: 1 0 0;"></div>
     110    <div data-expected-height="0" data-offset-y="50" style="-webkit-align-self: center; -webkit-flex: 1 0 0;"></div>
     111    <div data-offset-y="20" style="-webkit-align-self: baseline; -webkit-flex: 1 0 0;"><div style="display:inline-block;"></div></div>
     112    <div data-offset-y="20" style="-webkit-align-self: baseline; -webkit-flex: 1 0 0; margin: 20px;"><div style="display:inline-block;"></div></div>
     113    <div data-offset-y="50" style="-webkit-align-self: baseline; -webkit-flex: 1 0 0; margin: auto 0;"></div>
     114    <div data-offset-y="30" style="-webkit-align-self: baseline; -webkit-flex: 1 0 0; margin: 30px 0 auto;"><div style="display:inline-block;"></div></div>
     115    <div data-offset-y="80" style="-webkit-align-self: baseline; -webkit-flex: 1 0 0; margin: auto 0 20px;"></div>
     116    <div data-expected-height="100" data-offset-y="0" style="-webkit-align-self: stretch; -webkit-flex: 1 0 0;"></div>
     117</div>
     118
     119<div class="flexbox" style="-webkit-align-items: end">
     120    <div data-expected-height="100" data-offset-y="0" style="-webkit-align-self: auto; -webkit-flex: 1 0 0; height: 100px;"></div>
     121    <div data-expected-height="0" data-offset-y="100" style="-webkit-align-self: auto; -webkit-flex: 1 0 0;"></div>
     122    <div data-expected-height="0" data-offset-y="0" style="-webkit-align-self: start; -webkit-flex: 1 0 0;"></div>
     123    <div data-expected-height="0" data-offset-y="100" style="-webkit-align-self: end; -webkit-flex: 1 0 0;"></div>
     124    <div data-expected-height="0" data-offset-y="50" style="-webkit-align-self: center; -webkit-flex: 1 0 0;"></div>
     125    <div data-offset-y="20" style="-webkit-align-self: baseline; -webkit-flex: 1 0 0;"><div style="display:inline-block;"></div></div>
     126    <div data-offset-y="20" style="-webkit-align-self: baseline; -webkit-flex: 1 0 0; margin: 20px;"><div style="display:inline-block;"></div></div>
     127    <div data-expected-height="100" data-offset-y="0" style="-webkit-align-self: stretch; -webkit-flex: 1 0 0;"></div>
     128</div>
     129
     130<div class="flexbox" style="-webkit-align-items: center">
     131    <div data-expected-height="100" data-offset-y="0" style="-webkit-align-self: auto; -webkit-flex: 1 0 0; height: 100px;"></div>
     132    <div data-expected-height="0" data-offset-y="50" style="-webkit-align-self: auto; -webkit-flex: 1 0 0;"></div>
     133    <div data-expected-height="0" data-offset-y="0" style="-webkit-align-self: start; -webkit-flex: 1 0 0;"></div>
     134    <div data-expected-height="0" data-offset-y="100" style="-webkit-align-self: end; -webkit-flex: 1 0 0;"></div>
     135    <div data-expected-height="0" data-offset-y="50" style="-webkit-align-self: center; -webkit-flex: 1 0 0;"></div>
     136    <div data-offset-y="20" style="-webkit-align-self: baseline; -webkit-flex: 1 0 0;"><div style="display:inline-block;"></div></div>
     137    <div data-offset-y="20" style="-webkit-align-self: baseline; -webkit-flex: 1 0 0; margin: 20px;"><div style="display:inline-block;"></div></div>
     138    <div data-expected-height="100" data-offset-y="0" style="-webkit-align-self: stretch; -webkit-flex: 1 0 0;"></div>
     139</div>
     140
     141<div class="flexbox" style="-webkit-align-items: baseline">
     142    <div data-expected-height="100" data-offset-y="0" style="-webkit-align-self: start; -webkit-flex: 1 0 0; height: 100px;"></div>
     143    <div data-offset-y="20" style="-webkit-align-self: auto; -webkit-flex: 1 0 0;"><div style="display:inline-block;"></div></div>
     144    <div data-expected-height="0" data-offset-y="0" style="-webkit-align-self: start; -webkit-flex: 1 0 0;"></div>
     145    <div data-expected-height="0" data-offset-y="100" style="-webkit-align-self: end; -webkit-flex: 1 0 0;"></div>
     146    <div data-expected-height="0" data-offset-y="50" style="-webkit-align-self: center; -webkit-flex: 1 0 0;"></div>
     147    <div data-offset-y="20" style="-webkit-align-self: baseline; -webkit-flex: 1 0 0;"><div style="display:inline-block;"></div></div>
     148    <div data-offset-y="20" style="-webkit-align-self: baseline; -webkit-flex: 1 0 0; margin: 20px;"><div style="display:inline-block;"></div></div>
     149    <div data-expected-height="100" data-offset-y="0" style="-webkit-align-self: stretch; -webkit-flex: 1 0 0;"></div>
     150</div>
     151
     152<div class="flexbox" style="-webkit-align-items: stretch">
     153    <div data-expected-height="100" data-offset-y="0" style="-webkit-align-self: auto; -webkit-flex: 1 0 0; height: 100px;"></div>
     154    <div data-expected-height="100" data-offset-y="0" style="-webkit-align-self: auto; -webkit-flex: 1 0 0;"></div>
     155    <div data-expected-height="0" data-offset-y="0" style="-webkit-align-self: start; -webkit-flex: 1 0 0;"></div>
     156    <div data-expected-height="0" data-offset-y="100" style="-webkit-align-self: end; -webkit-flex: 1 0 0;"></div>
     157    <div data-expected-height="0" data-offset-y="50" style="-webkit-align-self: center; -webkit-flex: 1 0 0;"></div>
     158    <div data-offset-y="20" style="-webkit-align-self: baseline; -webkit-flex: 1 0 0;"><div style="display:inline-block;"></div></div>
     159    <div data-offset-y="20" style="-webkit-align-self: baseline; -webkit-flex: 1 0 0; margin: 20px;"><div style="display:inline-block;"></div></div>
     160    <div data-expected-height="100" data-offset-y="0" style="-webkit-align-self: stretch; -webkit-flex: 1 0 0;"></div>
    161161</div>
    162162
    … …  
    184184
    185185<div class="flexbox">
    186   <div data-expected-height="0" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: start;"></div>
    187   <div data-expected-height="50" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: start; height: 50px;"></div>
    188   <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: start; height: 50px; margin: auto 0"></div>
    189   <div data-expected-height="50" data-offset-y="50" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: start; height: 50px; margin: auto 0 0"></div>
    190   <div data-expected-height="50" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: start; height: 50px; margin: 0 0 auto"></div>
    191   <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: start; height: 50px; margin: 25px 0"></div>
    192   <div data-expected-height="50" data-offset-y="20" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: start; height: 50px; margin: 20px 0 10px;"></div>
    193   <div data-expected-height="100" data-offset-y="0" style="-webkit-flex: 1 0 0; height: 100px;"></div>
    194 </div>
    195 
    196 <div class="flexbox">
    197   <div data-expected-height="0" data-offset-y="100" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: end;"></div>
    198   <div data-expected-height="50" data-offset-y="50" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: end; height: 50px;"></div>
    199   <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: end; height: 50px; margin: auto 0"></div>
    200   <div data-expected-height="50" data-offset-y="50" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: end; height: 50px; margin: auto 0 0"></div>
    201   <div data-expected-height="50" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: end; height: 50px; margin: 0 0 auto"></div>
    202   <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: end; height: 50px; margin: 25px 0"></div>
    203   <div data-expected-height="50" data-offset-y="40" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: end; height: 50px; margin: 20px 0 10px;"></div>
    204   <div data-expected-height="100" data-offset-y="0" style="-webkit-flex: 1 0 0; height: 100px;"></div>
    205 </div>
    206 
    207 <div class="flexbox">
    208   <div data-expected-height="0" data-offset-y="50" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center;"></div>
    209   <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center; height: 50px;"></div>
    210   <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center; height: 50px; margin: auto 0"></div>
    211   <div data-expected-height="50" data-offset-y="50" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center; height: 50px; margin: auto 0 0"></div>
    212   <div data-expected-height="50" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center; height: 50px; margin: 0 0 auto"></div>
    213   <div data-expected-height="50" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center; height: 50px; margin: 0 0 auto"></div>
    214   <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center; height: 50px; margin: 25px 0"></div>
    215   <div data-expected-height="50" data-offset-y="30" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center; height: 50px; margin: 20px 0 10px;"></div>
    216   <div data-expected-height="100" data-offset-y="0" style="-webkit-flex: 1 0 0; height: 100px;"></div>
    217 </div>
    218 
    219 <div class="flexbox">
    220   <div data-expected-height="50" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: start; height: 50px; -webkit-writing-mode: vertical-rl;"></div>
    221   <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center; height: 50px; -webkit-writing-mode: vertical-rl;"></div>
    222   <div data-expected-height="50" data-offset-y="50" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: end; height: 50px; -webkit-writing-mode: vertical-rl;"></div>
     186  <div data-expected-height="0" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-align-self: start;"></div>
     187  <div data-expected-height="50" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-align-self: start; height: 50px;"></div>
     188  <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-align-self: start; height: 50px; margin: auto 0"></div>
     189  <div data-expected-height="50" data-offset-y="50" style="-webkit-flex: 1 0 0; -webkit-align-self: start; height: 50px; margin: auto 0 0"></div>
     190  <div data-expected-height="50" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-align-self: start; height: 50px; margin: 0 0 auto"></div>
     191  <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-align-self: start; height: 50px; margin: 25px 0"></div>
     192  <div data-expected-height="50" data-offset-y="20" style="-webkit-flex: 1 0 0; -webkit-align-self: start; height: 50px; margin: 20px 0 10px;"></div>
     193  <div data-expected-height="100" data-offset-y="0" style="-webkit-flex: 1 0 0; height: 100px;"></div>
     194</div>
     195
     196<div class="flexbox">
     197  <div data-expected-height="0" data-offset-y="100" style="-webkit-flex: 1 0 0; -webkit-align-self: end;"></div>
     198  <div data-expected-height="50" data-offset-y="50" style="-webkit-flex: 1 0 0; -webkit-align-self: end; height: 50px;"></div>
     199  <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-align-self: end; height: 50px; margin: auto 0"></div>
     200  <div data-expected-height="50" data-offset-y="50" style="-webkit-flex: 1 0 0; -webkit-align-self: end; height: 50px; margin: auto 0 0"></div>
     201  <div data-expected-height="50" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-align-self: end; height: 50px; margin: 0 0 auto"></div>
     202  <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-align-self: end; height: 50px; margin: 25px 0"></div>
     203  <div data-expected-height="50" data-offset-y="40" style="-webkit-flex: 1 0 0; -webkit-align-self: end; height: 50px; margin: 20px 0 10px;"></div>
     204  <div data-expected-height="100" data-offset-y="0" style="-webkit-flex: 1 0 0; height: 100px;"></div>
     205</div>
     206
     207<div class="flexbox">
     208  <div data-expected-height="0" data-offset-y="50" style="-webkit-flex: 1 0 0; -webkit-align-self: center;"></div>
     209  <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-align-self: center; height: 50px;"></div>
     210  <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-align-self: center; height: 50px; margin: auto 0"></div>
     211  <div data-expected-height="50" data-offset-y="50" style="-webkit-flex: 1 0 0; -webkit-align-self: center; height: 50px; margin: auto 0 0"></div>
     212  <div data-expected-height="50" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-align-self: center; height: 50px; margin: 0 0 auto"></div>
     213  <div data-expected-height="50" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-align-self: center; height: 50px; margin: 0 0 auto"></div>
     214  <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-align-self: center; height: 50px; margin: 25px 0"></div>
     215  <div data-expected-height="50" data-offset-y="30" style="-webkit-flex: 1 0 0; -webkit-align-self: center; height: 50px; margin: 20px 0 10px;"></div>
     216  <div data-expected-height="100" data-offset-y="0" style="-webkit-flex: 1 0 0; height: 100px;"></div>
     217</div>
     218
     219<div class="flexbox">
     220  <div data-expected-height="50" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-align-self: start; height: 50px; -webkit-writing-mode: vertical-rl;"></div>
     221  <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-align-self: center; height: 50px; -webkit-writing-mode: vertical-rl;"></div>
     222  <div data-expected-height="50" data-offset-y="50" style="-webkit-flex: 1 0 0; -webkit-align-self: end; height: 50px; -webkit-writing-mode: vertical-rl;"></div>
    223223  <div data-expected-height="50" data-offset-y="0" style="-webkit-flex: 1 0 0; height: 50px; -webkit-writing-mode: vertical-rl;"></div>
    224224  <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; height: 50px; margin: auto 0; -webkit-writing-mode: vertical-rl;"></div>
    … …  
    227227
    228228<div class="flexbox">
    229   <div data-expected-height="50" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: start; height: 50px;"></div>
    230   <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center; height: 50px;"></div>
    231   <div data-expected-height="50" data-offset-y="50" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: end; height: 50px;"></div>
     229  <div data-expected-height="50" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-align-self: start; height: 50px;"></div>
     230  <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-align-self: center; height: 50px;"></div>
     231  <div data-expected-height="50" data-offset-y="50" style="-webkit-flex: 1 0 0; -webkit-align-self: end; height: 50px;"></div>
    232232  <div data-expected-height="50" data-offset-y="0" style="-webkit-flex: 1 0 0; height: 50px;"></div>
    233233  <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; height: 50px; margin: auto 0"></div>
    … …  
    237237
    238238<div class="flexbox">
    239   <div data-expected-height="20" data-offset-y="20" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline; height: 20px;"></div>
     239  <div data-expected-height="20" data-offset-y="20" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline; height: 20px;"></div>
    240240  <!-- FIXME: This looks like it might be positioned 10 pixels too high due the margin-bottom. All the boxes should have their bottoms aligned I think. -->
    241   <div data-expected-height="10" data-offset-y="20" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline; height: 10px; margin: 20px 0 10px;"></div>
    242   <div data-expected-height="10" data-offset-y="30" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline; height: 10px; margin: 20px 0 0;"></div>
     241  <div data-expected-height="10" data-offset-y="20" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline; height: 10px; margin: 20px 0 10px;"></div>
     242  <div data-expected-height="10" data-offset-y="30" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline; height: 10px; margin: 20px 0 0;"></div>
    243243  <div data-expected-height="100" data-offset-y="0" style="-webkit-flex: 1 0 0; height: 100px;"></div>
    244244</div>
    245245
    246246<div class="flexbox" style="max-height: 20px">
    247   <div data-expected-height="40" data-offset-y="-10" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center; height: 40px;"></div>
    248   <div data-expected-height="40" data-offset-y="-20" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: end; height: 40px;"></div>
     247  <div data-expected-height="40" data-offset-y="-10" style="-webkit-flex: 1 0 0; -webkit-align-self: center; height: 40px;"></div>
     248  <div data-expected-height="40" data-offset-y="-20" style="-webkit-flex: 1 0 0; -webkit-align-self: end; height: 40px;"></div>
    249249  <div data-expected-height="40" data-offset-y="0" style="-webkit-flex: 1 0 0; height: 40px;"></div>
    250250  <div data-expected-height="20" data-offset-y="0" style="-webkit-flex: 1 0 0;"></div>
    … …  
    252252
    253253<div class="flexbox">
    254   <div id="baseline1" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline;">ahem</div>
    255   <div id="baseline2" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline;"><img src="../../fast/replaced/resources/1x1-blue.png" style="height: 50px;"></div>
    256   <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: center;"><img src="../../fast/replaced/resources/1x1-blue.png" style="height: 50px; vertical-align: middle"></div>
    257   <div id="baseline3" data-expected-height="50" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline;"><img src="../../fast/replaced/resources/1x1-blue.png" style="height: 50px; vertical-align: middle"></div>
    258   <div data-expected-height="100" data-offset-y="0" style="-webkit-flex: 1 0 0; height: 100px;"></div>
    259 </div>
    260 
    261 <div class="flexbox">
    262   <div id="baseline4" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline;">ahem</div>
    263   <div id="baseline5" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline;"><br><img src="../../fast/replaced/resources/1x1-blue.png" style="height: 50px;"></div>
    264   <div data-expected-height="50" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-flex-item-align: baseline;"><img src="../../fast/replaced/resources/1x1-blue.png" style="height: 50px; vertical-align: middle"></div>
     254  <div id="baseline1" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline;">ahem</div>
     255  <div id="baseline2" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline;"><img src="../../fast/replaced/resources/1x1-blue.png" style="height: 50px;"></div>
     256  <div data-expected-height="50" data-offset-y="25" style="-webkit-flex: 1 0 0; -webkit-align-self: center;"><img src="../../fast/replaced/resources/1x1-blue.png" style="height: 50px; vertical-align: middle"></div>
     257  <div id="baseline3" data-expected-height="50" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline;"><img src="../../fast/replaced/resources/1x1-blue.png" style="height: 50px; vertical-align: middle"></div>
     258  <div data-expected-height="100" data-offset-y="0" style="-webkit-flex: 1 0 0; height: 100px;"></div>
     259</div>
     260
     261<div class="flexbox">
     262  <div id="baseline4" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline;">ahem</div>
     263  <div id="baseline5" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline;"><br><img src="../../fast/replaced/resources/1x1-blue.png" style="height: 50px;"></div>
     264  <div data-expected-height="50" data-offset-y="0" style="-webkit-flex: 1 0 0; -webkit-align-self: baseline;"><img src="../../fast/replaced/resources/1x1-blue.png" style="height: 50px; vertical-align: middle"></div>
    265265  <div data-expected-height="100" data-offset-y="0" style="-webkit-flex: 1 0 0; height: 100px;"></div>
    266266</div>
    … …  
    277277               "baseline1 and baseline2 should have the same baseline.");
    278278    logIfFalse(baseline3.offsetTop < 25,
    279                "baseline3 should be above the center flex-item-aligned item.");
     279               "baseline3 should be above the center align-selfed item.");
    280280
    281281    var baseline4 = document.getElementById("baseline4");

  • trunk/LayoutTests/css3/flexbox/line-wrapping.html

    r117385 r119131  
    118118        <div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y=20 data-offset-x=0></div>
    119119    </div>
    120     <div data-expected-width=100 data-expected-height=40 style="-webkit-flex-item-align: start;">
     120    <div data-expected-width=100 data-expected-height=40 style="-webkit-align-self: start;">
    121121        <div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y=20 data-offset-x=100></div>
    122122    </div>
    … …  
    127127        <div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y=20 data-offset-x=0></div>
    128128    </div>
    129     <div data-expected-width=200 data-expected-height=50 style="-webkit-flex-item-align: start;">
     129    <div data-expected-width=200 data-expected-height=50 style="-webkit-align-self: start;">
    130130        <div data-offset-y=50></div><div data-offset-y=50></div><div data-offset-y=50></div><div data-offset-y=50></div><div data-offset-y=50></div><div data-offset-y=70 data-offset-x=0></div>
    131131    </div>
    … …  
    136136        <div data-offset-y=0></div><div data-offset-y=0></div>
    137137    </div>
    138     <div data-expected-width=80 data-expected-height=50 style="-webkit-flex-item-align: start;">
     138    <div data-expected-width=80 data-expected-height=50 style="-webkit-align-self: start;">
    139139        <div data-offset-y=50></div><div data-offset-y=50></div>
    140140    </div>
    … …  
    145145        <div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y=20 data-offset-x=0></div>
    146146    </div>
    147     <div data-expected-width=250 data-expected-height=40 style="-webkit-flex-item-align: start;">
     147    <div data-expected-width=250 data-expected-height=40 style="-webkit-align-self: start;">
    148148        <div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y=20 data-offset-x=250></div>
    149149    </div>
    … …  
    154154        <div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y=20 data-offset-x=0></div>
    155155    </div>
    156     <div data-expected-width=500 data-expected-height=0 style="-webkit-flex-item-align: start;">
     156    <div data-expected-width=500 data-expected-height=0 style="-webkit-align-self: start;">
    157157        <div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y=0></div><div data-offset-y=20 data-offset-x=0></div>
    158158    </div>
    … …  
    165165        <div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x=24 data-offset-y=0></div>
    166166    </div>
    167     <div data-expected-height=100 data-expected-width=40 style="-webkit-flex-item-align: start;">
     167    <div data-expected-height=100 data-expected-width=40 style="-webkit-align-self: start;">
    168168        <div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x=24 data-offset-y=100></div>
    169169    </div>
    … …  
    174174        <div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x=24 data-offset-y=0></div>
    175175    </div>
    176     <div data-expected-height=200 data-expected-width=50 style="-webkit-flex-item-align: start;">
     176    <div data-expected-height=200 data-expected-width=50 style="-webkit-align-self: start;">
    177177        <div data-offset-x=54></div><div data-offset-x=54></div><div data-offset-x=54></div><div data-offset-x=54></div><div data-offset-x=54></div><div data-offset-x=74 data-offset-y=0></div>
    178178    </div>
    … …  
    183183        <div data-offset-x=4></div><div data-offset-x=4></div>
    184184    </div>
    185     <div data-expected-height=80 data-expected-width=50 style="-webkit-flex-item-align: start;">
     185    <div data-expected-height=80 data-expected-width=50 style="-webkit-align-self: start;">
    186186        <div data-offset-x=54></div><div data-offset-x=54></div>
    187187    </div>
    … …  
    192192        <div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x=24 data-offset-y=0></div>
    193193    </div>
    194     <div data-expected-height=250 data-expected-width=40 style="-webkit-flex-item-align: start;">
     194    <div data-expected-height=250 data-expected-width=40 style="-webkit-align-self: start;">
    195195        <div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x=24 data-offset-y=250></div>
    196196    </div>
    … …  
    201201        <div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x=24 data-offset-y=0></div>
    202202    </div>
    203     <div data-expected-height=500 data-expected-width=0 style="-webkit-flex-item-align: start;">
     203    <div data-expected-height=500 data-expected-width=0 style="-webkit-align-self: start;">
    204204        <div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x=4></div><div data-offset-x=24 data-offset-y=0></div>
    205205    </div>
    … …  
    211211        <div data-offset-x=80></div><div data-offset-x=80></div><div data-offset-x=60 data-offset-y=0></div>
    212212    </div>
    213     <div data-expected-height=100 data-expected-width=40 style="-webkit-flex-item-align: start;">
     213    <div data-expected-height=100 data-expected-width=40 style="-webkit-align-self: start;">
    214214        <div data-offset-x=80></div><div data-offset-x=80></div><div data-offset-x=60 data-offset-y=100></div>
    215215    </div>
    … …  
    220220        <div data-offset-x=80></div><div data-offset-x=80></div><div data-offset-x=80></div><div data-offset-x=80></div><div data-offset-x=80></div><div data-offset-x=60 data-offset-y=0></div>
    221221    </div>
    222     <div data-expected-height=200 data-expected-width=50 style="-webkit-flex-item-align: start;">
     222    <div data-expected-height=200 data-expected-width=50 style="-webkit-align-self: start;">
    223223        <div data-offset-x=30></div><div data-offset-x=30></div><div data-offset-x=30></div><div data-offset-x=30></div><div data-offset-x=30></div><div data-offset-x=10 data-offset-y=0></div>
    224224    </div>
    … …  
    229229        <div data-offset-x=80></div><div data-offset-x=80></div>
    230230    </div>
    231     <div data-expected-height=80 data-expected-width=50 style="-webkit-flex-item-align: start;">
     231    <div data-expected-height=80 data-expected-width=50 style="-webkit-align-self: start;">
    232232        <div data-offset-x=30></div><div data-offset-x=30></div>
    233233    </div>
    … …  
    238238        <div data-offset-x=80></div><div data-offset-x=80></div><div data-offset-x=60 data-offset-y=0></div>
    239239    </div>
    240     <div data-expected-height=250 data-expected-width=40 style="-webkit-flex-item-align: start;">
     240    <div data-expected-height=250 data-expected-width=40 style="-webkit-align-self: start;">
    241241        <div data-offset-x=80></div><div data-offset-x=80></div><div data-offset-x=60 data-offset-y=250></div>
    242242    </div>
    … …  
    250250        <div data-offset-x=-20></div><div data-offset-x=-20></div><div data-offset-x=-20></div><div data-offset-x=-20></div><div data-offset-x=-20></div><div data-offset-x=-40 data-offset-y=0></div>
    251251    </div>
    252     <div data-expected-height=500 data-expected-width=0 style="-webkit-flex-item-align: start;">
     252    <div data-expected-height=500 data-expected-width=0 style="-webkit-align-self: start;">
    253253        <div data-offset-x=-20></div><div data-offset-x=-20></div><div data-offset-x=-20></div><div data-offset-x=-20></div><div data-offset-x=-20></div><div data-offset-x=-40 data-offset-y=0></div>
    254254    </div>

  • trunk/LayoutTests/css3/flexbox/multiline-align.html

    r117385 r119131  
    13081308    child.setAttribute('style', '-webkit-flex: 1 ' + preferredSize + 'px;'
    13091309        + crossAxis + ': ' + crossAxisLength + ';'
    1310         + '-webkit-flex-item-align: ' + alignment);
     1310        + '-webkit-align-self: ' + alignment);
    13111311
    13121312    child.setAttribute("data-expected-width", expectations[0]);

  • trunk/LayoutTests/css3/flexbox/multiline-reverse-wrap-baseline.html

    r117385 r119131  
    88    position: relative;
    99    -webkit-flex-wrap: wrap-reverse;
    10     -webkit-flex-align: baseline;
     10    -webkit-align-items: baseline;
    1111    margin-bottom: 10px;
    1212}
    … …  
    4747
    4848<div class="flexbox" style="width: 300px;">
    49   <div style="-webkit-flex: 1 0 100px; -webkit-flex-item-align: start; height: 100px">first</div>
     49  <div style="-webkit-flex: 1 0 100px; -webkit-align-self: start; height: 100px">first</div>
    5050  <div style="-webkit-flex: 1 0 100px;">second</div>
    5151  <div style="-webkit-flex: 1 0 100px;">third<br>third</div>

  • trunk/LayoutTests/css3/flexbox/orthogonal-flex-directions.html

    r117385 r119131  
    6060
    6161.align-start {
    62     -webkit-flex-item-align: start;
     62    -webkit-align-self: start;
    6363}
    6464</style>

  • trunk/LayoutTests/css3/flexbox/position-absolute-child.html

    r118971 r119131  
    529529}
    530530
    531 function addFlexAlignCenterTests(writingMode, flexFlow, direction, flexDirection)
     531function addAlignItemsCenterTests(writingMode, flexFlow, direction, flexDirection)
    532532{
    533533    var flexboxClassName = writingMode + ' ' + direction + ' ' + flexFlow;
    … …  
    541541        flexbox.style.margin = "20px";
    542542        flexbox.style.webkitFlexPack = 'center';
    543         flexbox.style.webkitFlexAlign = 'center';
     543        flexbox.style.webkitAlignItems = 'center';
    544544
    545545        for (var childIndex = 1; childIndex <= 3; ++childIndex) {
    … …  
    595595            }
    596596            addFlexPackJustifyTests(writingMode, flexFlow, direction, flexDirection);
    597             addFlexAlignCenterTests(writingMode, flexFlow, direction, flexDirection);
     597            addAlignItemsCenterTests(writingMode, flexFlow, direction, flexDirection);
    598598        })
    599599    })

  • trunk/LayoutTests/css3/flexbox/true-centering.html

    r118971 r119131  
    5858<body onload="checkFlexBoxen()">
    5959
    60 <div class="flexbox" style="-webkit-flex-align: center; -webkit-flex-pack: center;">
     60<div class="flexbox" style="-webkit-align-items: center; -webkit-flex-pack: center;">
    6161    <div data-offset-x="-10" data-offset-y="-5"></div>
    6262    <div data-offset-x="50" data-offset-y="-5"></div>
    6363</div>
    6464
    65 <div class="flexbox row-reverse" style="-webkit-flex-align: center; -webkit-flex-pack: center;">
     65<div class="flexbox row-reverse" style="-webkit-align-items: center; -webkit-flex-pack: center;">
    6666    <div data-offset-x="50" data-offset-y="-5"></div>
    6767    <div data-offset-x="-10" data-offset-y="-5"></div>
    6868</div>
    6969
    70 <div class="flexbox column vertical" style="-webkit-flex-align: center; -webkit-flex-pack: center;">
     70<div class="flexbox column vertical" style="-webkit-align-items: center; -webkit-flex-pack: center;">
    7171    <div data-offset-x="-5" data-offset-y="-10"></div>
    7272    <div data-offset-x="-5" data-offset-y="50"></div>
    7373</div>
    7474
    75 <div class="flexbox column-reverse vertical" style="-webkit-flex-align: center; -webkit-flex-pack: center;">
     75<div class="flexbox column-reverse vertical" style="-webkit-align-items: center; -webkit-flex-pack: center;">
    7676    <div data-offset-x="-5" data-offset-y="50"></div>
    7777    <div data-offset-x="-5" data-offset-y="-10"></div>
    7878</div>
    7979
    80 <div class="flexbox" style="-webkit-flex-align: center; -webkit-flex-pack: space-around;">
     80<div class="flexbox" style="-webkit-align-items: center; -webkit-flex-pack: space-around;">
    8181    <div data-offset-x="-10" data-offset-y="-5"></div>
    8282    <div data-offset-x="50" data-offset-y="-5"></div>
    8383</div>
    8484
    85 <div class="flexbox" style="-webkit-flex-align: start; -webkit-flex-pack: start;">
     85<div class="flexbox" style="-webkit-align-items: start; -webkit-flex-pack: start;">
    8686    <div data-offset-x=0 data-offset-y=0></div>
    8787    <div data-offset-x=60 data-offset-y=0></div>
    8888</div>
    8989
    90 <div class="flexbox" style="-webkit-flex-align: start; -webkit-flex-pack: space-between;">
     90<div class="flexbox" style="-webkit-align-items: start; -webkit-flex-pack: space-between;">
    9191    <div data-offset-x=0 data-offset-y=0></div>
    9292    <div data-offset-x=60 data-offset-y=0></div>
    … …  
    144144
    145145            var container = document.createElement('div');
    146             container.innerHTML = '<div class="flexbox ' + flexboxClassName + '" style="-webkit-flex-align: center; -webkit-flex-pack: center;">\n' +
     146            container.innerHTML = '<div class="flexbox ' + flexboxClassName + '" style="-webkit-align-items: center; -webkit-flex-pack: center;">\n' +
    147147                '<div ' + firstChildExpected + '></div>\n' +
    148148                '<div ' + lastChildExpected + '></div>\n' +

  • trunk/LayoutTests/fast/css/getComputedStyle/computed-style-expected.txt

    r118853 r119131  
    146146-webkit-column-width: auto;
    147147-webkit-filter: none;
     148-webkit-align-items: stretch;
     149-webkit-align-self: stretch;
    148150-webkit-flex: 0 0 auto;
    149151-webkit-flex-order: 0;
    150152-webkit-flex-pack: start;
    151 -webkit-flex-align: stretch;
    152 -webkit-flex-item-align: stretch;
    153153-webkit-flex-direction: row;
    154154-webkit-flex-flow: row none;

  • trunk/LayoutTests/fast/css/getComputedStyle/computed-style-without-renderer-expected.txt

    r118853 r119131  
    144144    -webkit-column-span: 1
    145145    -webkit-column-width: auto
     146    -webkit-align-items: stretch
     147    -webkit-align-self: stretch
    146148    -webkit-flex: 0 0 auto
    147149    -webkit-flex-order: 0
    148150    -webkit-flex-pack: start
    149     -webkit-flex-align: stretch
    150     -webkit-flex-item-align: stretch
    151151    -webkit-flex-direction: row
    152152    -webkit-flex-flow: row none

  • trunk/LayoutTests/platform/chromium-linux-x86/svg/css/getComputedStyle-basic-expected.txt

    r118853 r119131  
    289289rect: style.getPropertyValue(-webkit-filter) : none
    290290rect: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     291rect: style.getPropertyValue(-webkit-align-items) : stretch
     292rect: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     293rect: style.getPropertyValue(-webkit-align-self) : stretch
     294rect: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    291295rect: style.getPropertyValue(-webkit-flex) : 0 0 auto
    292296rect: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    295299rect: style.getPropertyValue(-webkit-flex-pack) : start
    296300rect: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    297 rect: style.getPropertyValue(-webkit-flex-align) : stretch
    298 rect: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    299 rect: style.getPropertyValue(-webkit-flex-item-align) : stretch
    300 rect: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    301301rect: style.getPropertyValue(-webkit-flex-direction) : row
    302302rect: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]
    … …  
    823823g: style.getPropertyValue(-webkit-filter) : none
    824824g: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     825g: style.getPropertyValue(-webkit-align-items) : stretch
     826g: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     827g: style.getPropertyValue(-webkit-align-self) : stretch
     828g: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    825829g: style.getPropertyValue(-webkit-flex) : 0 0 auto
    826830g: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    829833g: style.getPropertyValue(-webkit-flex-pack) : start
    830834g: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    831 g: style.getPropertyValue(-webkit-flex-align) : stretch
    832 g: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    833 g: style.getPropertyValue(-webkit-flex-item-align) : stretch
    834 g: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    835835g: style.getPropertyValue(-webkit-flex-direction) : row
    836836g: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]

  • trunk/LayoutTests/platform/chromium-linux/svg/css/getComputedStyle-basic-expected.txt

    r118853 r119131  
    289289rect: style.getPropertyValue(-webkit-filter) : none
    290290rect: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     291rect: style.getPropertyValue(-webkit-align-items) : stretch
     292rect: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     293rect: style.getPropertyValue(-webkit-align-self) : stretch
     294rect: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    291295rect: style.getPropertyValue(-webkit-flex) : 0 0 auto
    292296rect: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    295299rect: style.getPropertyValue(-webkit-flex-pack) : start
    296300rect: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    297 rect: style.getPropertyValue(-webkit-flex-align) : stretch
    298 rect: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    299 rect: style.getPropertyValue(-webkit-flex-item-align) : stretch
    300 rect: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    301301rect: style.getPropertyValue(-webkit-flex-direction) : row
    302302rect: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]
    … …  
    823823g: style.getPropertyValue(-webkit-filter) : none
    824824g: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     825g: style.getPropertyValue(-webkit-align-items) : stretch
     826g: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     827g: style.getPropertyValue(-webkit-align-self) : stretch
     828g: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    825829g: style.getPropertyValue(-webkit-flex) : 0 0 auto
    826830g: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    829833g: style.getPropertyValue(-webkit-flex-pack) : start
    830834g: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    831 g: style.getPropertyValue(-webkit-flex-align) : stretch
    832 g: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    833 g: style.getPropertyValue(-webkit-flex-item-align) : stretch
    834 g: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    835835g: style.getPropertyValue(-webkit-flex-direction) : row
    836836g: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]

  • trunk/LayoutTests/platform/chromium-mac-leopard/fast/css/getComputedStyle/computed-style-expected.txt

    r118853 r119131  
    146146-webkit-column-width: auto;
    147147-webkit-filter: none;
     148-webkit-align-items: stretch;
     149-webkit-align-self: stretch;
    148150-webkit-flex: 0 0 auto;
    149151-webkit-flex-order: 0;
    150152-webkit-flex-pack: start;
    151 -webkit-flex-align: stretch;
    152 -webkit-flex-item-align: stretch;
    153153-webkit-flex-direction: row;
    154154-webkit-flex-flow: row none;

  • trunk/LayoutTests/platform/chromium-mac-leopard/svg/css/getComputedStyle-basic-expected.txt

    r118853 r119131  
    289289rect: style.getPropertyValue(-webkit-filter) : none
    290290rect: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     291rect: style.getPropertyValue(-webkit-align-items) : stretch
     292rect: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     293rect: style.getPropertyValue(-webkit-align-self) : stretch
     294rect: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    291295rect: style.getPropertyValue(-webkit-flex) : 0 0 auto
    292296rect: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    295299rect: style.getPropertyValue(-webkit-flex-pack) : start
    296300rect: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    297 rect: style.getPropertyValue(-webkit-flex-align) : stretch
    298 rect: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    299 rect: style.getPropertyValue(-webkit-flex-item-align) : stretch
    300 rect: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    301301rect: style.getPropertyValue(-webkit-flex-direction) : row
    302302rect: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]
    … …  
    823823g: style.getPropertyValue(-webkit-filter) : none
    824824g: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     825g: style.getPropertyValue(-webkit-align-items) : stretch
     826g: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     827g: style.getPropertyValue(-webkit-align-self) : stretch
     828g: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    825829g: style.getPropertyValue(-webkit-flex) : 0 0 auto
    826830g: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    829833g: style.getPropertyValue(-webkit-flex-pack) : start
    830834g: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    831 g: style.getPropertyValue(-webkit-flex-align) : stretch
    832 g: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    833 g: style.getPropertyValue(-webkit-flex-item-align) : stretch
    834 g: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    835835g: style.getPropertyValue(-webkit-flex-direction) : row
    836836g: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]

  • trunk/LayoutTests/platform/chromium-mac-snowleopard/svg/css/getComputedStyle-basic-expected.txt

    r118853 r119131  
    289289rect: style.getPropertyValue(-webkit-filter) : none
    290290rect: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     291rect: style.getPropertyValue(-webkit-align-items) : stretch
     292rect: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     293rect: style.getPropertyValue(-webkit-align-self) : stretch
     294rect: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    291295rect: style.getPropertyValue(-webkit-flex) : 0 0 auto
    292296rect: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    295299rect: style.getPropertyValue(-webkit-flex-pack) : start
    296300rect: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    297 rect: style.getPropertyValue(-webkit-flex-align) : stretch
    298 rect: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    299 rect: style.getPropertyValue(-webkit-flex-item-align) : stretch
    300 rect: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    301301rect: style.getPropertyValue(-webkit-flex-direction) : row
    302302rect: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]
    … …  
    823823g: style.getPropertyValue(-webkit-filter) : none
    824824g: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     825g: style.getPropertyValue(-webkit-align-items) : stretch
     826g: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     827g: style.getPropertyValue(-webkit-align-self) : stretch
     828g: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    825829g: style.getPropertyValue(-webkit-flex) : 0 0 auto
    826830g: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    829833g: style.getPropertyValue(-webkit-flex-pack) : start
    830834g: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    831 g: style.getPropertyValue(-webkit-flex-align) : stretch
    832 g: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    833 g: style.getPropertyValue(-webkit-flex-item-align) : stretch
    834 g: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    835835g: style.getPropertyValue(-webkit-flex-direction) : row
    836836g: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]

  • trunk/LayoutTests/platform/chromium-mac/fast/css/getComputedStyle/computed-style-expected.txt

    r118853 r119131  
    146146-webkit-column-width: auto;
    147147-webkit-filter: none;
     148-webkit-align-items: stretch;
     149-webkit-align-self: stretch;
    148150-webkit-flex: 0 0 auto;
    149151-webkit-flex-order: 0;
    150152-webkit-flex-pack: start;
    151 -webkit-flex-align: stretch;
    152 -webkit-flex-item-align: stretch;
    153153-webkit-flex-direction: row;
    154154-webkit-flex-flow: row none;

  • trunk/LayoutTests/platform/chromium-mac/fast/css/getComputedStyle/computed-style-without-renderer-expected.txt

    r118853 r119131  
    145145    -webkit-column-width: auto
    146146    -webkit-filter: none
     147    -webkit-align-items: stretch
     148    -webkit-align-self: stretch
    147149    -webkit-flex: 0 0 auto
    148150    -webkit-flex-order: 0
    149151    -webkit-flex-pack: start
    150     -webkit-flex-align: stretch
    151     -webkit-flex-item-align: stretch
    152152    -webkit-flex-direction: row
    153153    -webkit-flex-flow: row none

  • trunk/LayoutTests/platform/chromium-mac/svg/css/getComputedStyle-basic-expected.txt

    r118853 r119131  
    289289rect: style.getPropertyValue(-webkit-filter) : none
    290290rect: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     291rect: style.getPropertyValue(-webkit-align-items) : stretch
     292rect: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     293rect: style.getPropertyValue(-webkit-align-self) : stretch
     294rect: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    291295rect: style.getPropertyValue(-webkit-flex) : 0 0 auto
    292296rect: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    295299rect: style.getPropertyValue(-webkit-flex-pack) : start
    296300rect: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    297 rect: style.getPropertyValue(-webkit-flex-align) : stretch
    298 rect: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    299 rect: style.getPropertyValue(-webkit-flex-item-align) : stretch
    300 rect: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    301301rect: style.getPropertyValue(-webkit-flex-direction) : row
    302302rect: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]
    … …  
    823823g: style.getPropertyValue(-webkit-filter) : none
    824824g: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     825g: style.getPropertyValue(-webkit-align-items) : stretch
     826g: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     827g: style.getPropertyValue(-webkit-align-self) : stretch
     828g: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    825829g: style.getPropertyValue(-webkit-flex) : 0 0 auto
    826830g: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    829833g: style.getPropertyValue(-webkit-flex-pack) : start
    830834g: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    831 g: style.getPropertyValue(-webkit-flex-align) : stretch
    832 g: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    833 g: style.getPropertyValue(-webkit-flex-item-align) : stretch
    834 g: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    835835g: style.getPropertyValue(-webkit-flex-direction) : row
    836836g: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]

  • trunk/LayoutTests/platform/chromium-win-vista/svg/css/getComputedStyle-basic-expected.txt

    r118853 r119131  
    289289rect: style.getPropertyValue(-webkit-filter) : none
    290290rect: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     291rect: style.getPropertyValue(-webkit-align-items) : stretch
     292rect: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     293rect: style.getPropertyValue(-webkit-align-self) : stretch
     294rect: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    291295rect: style.getPropertyValue(-webkit-flex) : 0 0 auto
    292296rect: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    295299rect: style.getPropertyValue(-webkit-flex-pack) : start
    296300rect: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    297 rect: style.getPropertyValue(-webkit-flex-align) : stretch
    298 rect: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    299 rect: style.getPropertyValue(-webkit-flex-item-align) : stretch
    300 rect: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    301301rect: style.getPropertyValue(-webkit-flex-direction) : row
    302302rect: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]
    … …  
    823823g: style.getPropertyValue(-webkit-filter) : none
    824824g: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     825g: style.getPropertyValue(-webkit-align-items) : stretch
     826g: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     827g: style.getPropertyValue(-webkit-align-self) : stretch
     828g: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    825829g: style.getPropertyValue(-webkit-flex) : 0 0 auto
    826830g: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    829833g: style.getPropertyValue(-webkit-flex-pack) : start
    830834g: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    831 g: style.getPropertyValue(-webkit-flex-align) : stretch
    832 g: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    833 g: style.getPropertyValue(-webkit-flex-item-align) : stretch
    834 g: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    835835g: style.getPropertyValue(-webkit-flex-direction) : row
    836836g: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]

  • trunk/LayoutTests/platform/chromium-win-xp/svg/css/getComputedStyle-basic-expected.txt

    r118853 r119131  
    289289rect: style.getPropertyValue(-webkit-filter) : none
    290290rect: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     291rect: style.getPropertyValue(-webkit-align-items) : stretch
     292rect: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     293rect: style.getPropertyValue(-webkit-align-self) : stretch
     294rect: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    291295rect: style.getPropertyValue(-webkit-flex) : 0 0 auto
    292296rect: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    295299rect: style.getPropertyValue(-webkit-flex-pack) : start
    296300rect: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    297 rect: style.getPropertyValue(-webkit-flex-align) : stretch
    298 rect: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    299 rect: style.getPropertyValue(-webkit-flex-item-align) : stretch
    300 rect: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    301301rect: style.getPropertyValue(-webkit-flex-direction) : row
    302302rect: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]
    … …  
    823823g: style.getPropertyValue(-webkit-filter) : none
    824824g: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     825g: style.getPropertyValue(-webkit-align-items) : stretch
     826g: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     827g: style.getPropertyValue(-webkit-align-self) : stretch
     828g: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    825829g: style.getPropertyValue(-webkit-flex) : 0 0 auto
    826830g: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    829833g: style.getPropertyValue(-webkit-flex-pack) : start
    830834g: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    831 g: style.getPropertyValue(-webkit-flex-align) : stretch
    832 g: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    833 g: style.getPropertyValue(-webkit-flex-item-align) : stretch
    834 g: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    835835g: style.getPropertyValue(-webkit-flex-direction) : row
    836836g: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]

  • trunk/LayoutTests/platform/chromium-win/fast/css/getComputedStyle/computed-style-expected.txt

    r118853 r119131  
    146146-webkit-column-width: auto;
    147147-webkit-filter: none;
     148-webkit-align-items: stretch;
     149-webkit-align-self: stretch;
    148150-webkit-flex: 0 0 auto;
    149151-webkit-flex-order: 0;
    150152-webkit-flex-pack: start;
    151 -webkit-flex-align: stretch;
    152 -webkit-flex-item-align: stretch;
    153153-webkit-flex-direction: row;
    154154-webkit-flex-flow: row none;

  • trunk/LayoutTests/platform/chromium-win/fast/css/getComputedStyle/computed-style-without-renderer-expected.txt

    r118853 r119131  
    145145    -webkit-column-width: auto
    146146    -webkit-filter: none
     147    -webkit-align-items: stretch
     148    -webkit-align-self: stretch
    147149    -webkit-flex: 0 0 auto
    148150    -webkit-flex-order: 0
    149151    -webkit-flex-pack: start
    150     -webkit-flex-align: stretch
    151     -webkit-flex-item-align: stretch
    152152    -webkit-flex-direction: row
    153153    -webkit-flex-flow: row none

  • trunk/LayoutTests/platform/chromium-win/svg/css/getComputedStyle-basic-expected.txt

    r118853 r119131  
    289289rect: style.getPropertyValue(-webkit-filter) : none
    290290rect: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     291rect: style.getPropertyValue(-webkit-align-items) : stretch
     292rect: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     293rect: style.getPropertyValue(-webkit-align-self) : stretch
     294rect: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    291295rect: style.getPropertyValue(-webkit-flex) : 0 0 auto
    292296rect: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    295299rect: style.getPropertyValue(-webkit-flex-pack) : start
    296300rect: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    297 rect: style.getPropertyValue(-webkit-flex-align) : stretch
    298 rect: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    299 rect: style.getPropertyValue(-webkit-flex-item-align) : stretch
    300 rect: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    301301rect: style.getPropertyValue(-webkit-flex-direction) : row
    302302rect: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]
    … …  
    823823g: style.getPropertyValue(-webkit-filter) : none
    824824g: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     825g: style.getPropertyValue(-webkit-align-items) : stretch
     826g: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     827g: style.getPropertyValue(-webkit-align-self) : stretch
     828g: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    825829g: style.getPropertyValue(-webkit-flex) : 0 0 auto
    826830g: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    829833g: style.getPropertyValue(-webkit-flex-pack) : start
    830834g: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    831 g: style.getPropertyValue(-webkit-flex-align) : stretch
    832 g: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    833 g: style.getPropertyValue(-webkit-flex-item-align) : stretch
    834 g: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    835835g: style.getPropertyValue(-webkit-flex-direction) : row
    836836g: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]

  • trunk/LayoutTests/platform/gtk/fast/css/getComputedStyle/computed-style-expected.txt

    r118853 r119131  
    145145-webkit-column-span: 1;
    146146-webkit-column-width: auto;
     147-webkit-align-items: stretch;
     148-webkit-align-self: stretch;
    147149-webkit-flex: 0 0 auto;
    148150-webkit-flex-order: 0;
    149151-webkit-flex-pack: start;
    150 -webkit-flex-align: stretch;
    151 -webkit-flex-item-align: stretch;
    152152-webkit-flex-direction: row;
    153153-webkit-flex-flow: row none;

  • trunk/LayoutTests/platform/gtk/svg/css/getComputedStyle-basic-expected.txt

    r118853 r119131  
    287287rect: style.getPropertyValue(-webkit-column-width) : auto
    288288rect: style.getPropertyCSSValue(-webkit-column-width) : [object CSSPrimitiveValue]
     289rect: style.getPropertyValue(-webkit-align-items) : stretch
     290rect: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     291rect: style.getPropertyValue(-webkit-align-self) : stretch
     292rect: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    289293rect: style.getPropertyValue(-webkit-flex) : 0 0 auto
    290294rect: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    293297rect: style.getPropertyValue(-webkit-flex-pack) : start
    294298rect: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    295 rect: style.getPropertyValue(-webkit-flex-align) : stretch
    296 rect: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    297 rect: style.getPropertyValue(-webkit-flex-item-align) : stretch
    298 rect: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    299299rect: style.getPropertyValue(-webkit-flex-direction) : row
    300300rect: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]
    … …  
    819819g: style.getPropertyValue(-webkit-column-width) : auto
    820820g: style.getPropertyCSSValue(-webkit-column-width) : [object CSSPrimitiveValue]
     821g: style.getPropertyValue(-webkit-align-items) : stretch
     822g: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     823g: style.getPropertyValue(-webkit-align-self) : stretch
     824g: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    821825g: style.getPropertyValue(-webkit-flex) : 0 0 auto
    822826g: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    825829g: style.getPropertyValue(-webkit-flex-pack) : start
    826830g: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    827 g: style.getPropertyValue(-webkit-flex-align) : stretch
    828 g: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    829 g: style.getPropertyValue(-webkit-flex-item-align) : stretch
    830 g: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    831831g: style.getPropertyValue(-webkit-flex-direction) : row
    832832g: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]

  • trunk/LayoutTests/platform/mac/fast/css/getComputedStyle/computed-style-expected.txt

    r118853 r119131  
    146146-webkit-column-width: auto;
    147147-webkit-filter: none;
     148-webkit-align-items: stretch;
     149-webkit-align-self: stretch;
    148150-webkit-flex: 0 0 auto;
    149151-webkit-flex-order: 0;
    150152-webkit-flex-pack: start;
    151 -webkit-flex-align: stretch;
    152 -webkit-flex-item-align: stretch;
    153153-webkit-flex-direction: row;
    154154-webkit-flex-flow: row none;

  • trunk/LayoutTests/platform/mac/fast/css/getComputedStyle/computed-style-without-renderer-expected.txt

    r118853 r119131  
    145145    -webkit-column-width: auto
    146146    -webkit-filter: none
     147    -webkit-align-items: stretch
     148    -webkit-align-self: stretch
    147149    -webkit-flex: 0 0 auto
    148150    -webkit-flex-order: 0
    149151    -webkit-flex-pack: start
    150     -webkit-flex-align: stretch
    151     -webkit-flex-item-align: stretch
    152152    -webkit-flex-direction: row
    153153    -webkit-flex-flow: row none

  • trunk/LayoutTests/platform/mac/svg/css/getComputedStyle-basic-expected.txt

    r118853 r119131  
    289289rect: style.getPropertyValue(-webkit-filter) : none
    290290rect: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     291rect: style.getPropertyValue(-webkit-align-items) : stretch
     292rect: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     293rect: style.getPropertyValue(-webkit-align-self) : stretch
     294rect: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    291295rect: style.getPropertyValue(-webkit-flex) : 0 0 auto
    292296rect: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    295299rect: style.getPropertyValue(-webkit-flex-pack) : start
    296300rect: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    297 rect: style.getPropertyValue(-webkit-flex-align) : stretch
    298 rect: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    299 rect: style.getPropertyValue(-webkit-flex-item-align) : stretch
    300 rect: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    301301rect: style.getPropertyValue(-webkit-flex-direction) : row
    302302rect: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]
    … …  
    823823g: style.getPropertyValue(-webkit-filter) : none
    824824g: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     825g: style.getPropertyValue(-webkit-align-items) : stretch
     826g: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     827g: style.getPropertyValue(-webkit-align-self) : stretch
     828g: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    825829g: style.getPropertyValue(-webkit-flex) : 0 0 auto
    826830g: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    829833g: style.getPropertyValue(-webkit-flex-pack) : start
    830834g: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    831 g: style.getPropertyValue(-webkit-flex-align) : stretch
    832 g: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    833 g: style.getPropertyValue(-webkit-flex-item-align) : stretch
    834 g: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    835835g: style.getPropertyValue(-webkit-flex-direction) : row
    836836g: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]

  • trunk/LayoutTests/platform/qt/fast/css/getComputedStyle/computed-style-without-renderer-expected.txt

    r118853 r119131  
    145145    -webkit-column-width: auto
    146146    -webkit-filter: none
     147    -webkit-align-items: stretch
     148    -webkit-align-self: stretch
    147149    -webkit-flex: 0 0 auto
    148150    -webkit-flex-order: 0
    149151    -webkit-flex-pack: start
    150     -webkit-flex-align: stretch
    151     -webkit-flex-item-align: stretch
    152152    -webkit-flex-direction: row
    153153    -webkit-flex-flow: row none

  • trunk/LayoutTests/platform/qt/svg/css/getComputedStyle-basic-expected.txt

    r118853 r119131  
    289289rect: style.getPropertyValue(-webkit-filter) : none
    290290rect: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     291rect: style.getPropertyValue(-webkit-align-items) : stretch
     292rect: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     293rect: style.getPropertyValue(-webkit-align-self) : stretch
     294rect: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    291295rect: style.getPropertyValue(-webkit-flex) : 0 0 auto
    292296rect: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    295299rect: style.getPropertyValue(-webkit-flex-pack) : start
    296300rect: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    297 rect: style.getPropertyValue(-webkit-flex-align) : stretch
    298 rect: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    299 rect: style.getPropertyValue(-webkit-flex-item-align) : stretch
    300 rect: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    301301rect: style.getPropertyValue(-webkit-flex-direction) : row
    302302rect: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]
    … …  
    823823g: style.getPropertyValue(-webkit-filter) : none
    824824g: style.getPropertyCSSValue(-webkit-filter) : [object CSSPrimitiveValue]
     825g: style.getPropertyValue(-webkit-align-items) : stretch
     826g: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     827g: style.getPropertyValue(-webkit-align-self) : stretch
     828g: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    825829g: style.getPropertyValue(-webkit-flex) : 0 0 auto
    826830g: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    829833g: style.getPropertyValue(-webkit-flex-pack) : start
    830834g: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    831 g: style.getPropertyValue(-webkit-flex-align) : stretch
    832 g: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    833 g: style.getPropertyValue(-webkit-flex-item-align) : stretch
    834 g: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    835835g: style.getPropertyValue(-webkit-flex-direction) : row
    836836g: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]

  • trunk/LayoutTests/platform/win/fast/css/getComputedStyle/computed-style-expected.txt

    r118853 r119131  
    146146-webkit-column-width: auto;
    147147-webkit-filter: none;
     148-webkit-align-items: stretch;
     149-webkit-align-self: stretch;
    148150-webkit-flex: 0 0 auto;
    149151-webkit-flex-order: 0;
    150152-webkit-flex-pack: start;
    151 -webkit-flex-align: stretch;
    152 -webkit-flex-item-align: stretch;
    153153-webkit-flex-direction: row;
    154154-webkit-flex-flow: row none;

  • trunk/LayoutTests/platform/win/fast/css/getComputedStyle/computed-style-without-renderer-expected.txt

    r118853 r119131  
    145145    -webkit-column-width: auto
    146146    -webkit-filter: none
     147    -webkit-align-items: stretch
     148    -webkit-align-self: stretch
    147149    -webkit-flex: 0 0 auto
    148150    -webkit-flex-order: 0
    149151    -webkit-flex-pack: start
    150     -webkit-flex-align: stretch
    151     -webkit-flex-item-align: stretch
    152152    -webkit-flex-direction: row
    153153    -webkit-flex-flow: row none

  • trunk/LayoutTests/svg/css/getComputedStyle-basic-expected.txt

    r118853 r119131  
    285285rect: style.getPropertyValue(-webkit-column-width) : auto
    286286rect: style.getPropertyCSSValue(-webkit-column-width) : [object CSSPrimitiveValue]
     287rect: style.getPropertyValue(-webkit-align-items) : stretch
     288rect: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     289rect: style.getPropertyValue(-webkit-align-self) : stretch
     290rect: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    287291rect: style.getPropertyValue(-webkit-flex) : 0 0 auto
    288292rect: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    291295rect: style.getPropertyValue(-webkit-flex-pack) : start
    292296rect: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    293 rect: style.getPropertyValue(-webkit-flex-align) : stretch
    294 rect: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    295 rect: style.getPropertyValue(-webkit-flex-item-align) : stretch
    296 rect: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    297297rect: style.getPropertyValue(-webkit-flex-direction) : row
    298298rect: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]
    … …  
    815815g: style.getPropertyValue(-webkit-column-width) : auto
    816816g: style.getPropertyCSSValue(-webkit-column-width) : [object CSSPrimitiveValue]
     817g: style.getPropertyValue(-webkit-align-items) : stretch
     818g: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
     819g: style.getPropertyValue(-webkit-align-self) : stretch
     820g: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
    817821g: style.getPropertyValue(-webkit-flex) : 0 0 auto
    818822g: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
    … …  
    821825g: style.getPropertyValue(-webkit-flex-pack) : start
    822826g: style.getPropertyCSSValue(-webkit-flex-pack) : [object CSSPrimitiveValue]
    823 g: style.getPropertyValue(-webkit-flex-align) : stretch
    824 g: style.getPropertyCSSValue(-webkit-flex-align) : [object CSSPrimitiveValue]
    825 g: style.getPropertyValue(-webkit-flex-item-align) : stretch
    826 g: style.getPropertyCSSValue(-webkit-flex-item-align) : [object CSSPrimitiveValue]
    827827g: style.getPropertyValue(-webkit-flex-direction) : row
    828828g: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]

  • trunk/Source/WebCore/ChangeLog

    r119125 r119131  
     12012-05-31  Tony Chang  <tony@chromium.org>
     2
     3        rename flexbox CSS properties from flex-align and flex-item-align to align-items and align-self
     4        https://bugs.webkit.org/show_bug.cgi?id=87907
     5
     6        Reviewed by Ojan Vafai.
     7
     8        This was recently changed in the spec:
     9        http://dev.w3.org/csswg/css3-flexbox/#align-items-property
     10
     11        No new tests, updated the tests to use the new naming.
     12
     13        * css/CSSComputedStyleDeclaration.cpp:
     14        (WebCore):
     15        (WebCore::CSSComputedStyleDeclaration::getPropertyCSSValue):
     16        * css/CSSParser.cpp:
     17        (WebCore::isValidKeywordPropertyAndValue):
     18        (WebCore::isKeywordPropertyID):
     19        (WebCore::CSSParser::parseValue):
     20        * css/CSSPrimitiveValueMappings.h:
     21        (WebCore::CSSPrimitiveValue::CSSPrimitiveValue):
     22        (WebCore::CSSPrimitiveValue::operator EAlignItems):
     23        * css/CSSProperty.cpp:
     24        (WebCore::CSSProperty::isInheritedProperty):
     25        * css/CSSPropertyNames.in:
     26        * css/StyleBuilder.cpp:
     27        (WebCore::StyleBuilder::StyleBuilder):
     28        * css/StyleResolver.cpp:
     29        (WebCore::StyleResolver::collectMatchingRulesForList):
     30        * rendering/RenderBox.cpp:
     31        (WebCore::RenderBox::sizesToIntrinsicLogicalWidth):
     32        * rendering/RenderFlexibleBox.cpp:
     33        (WebCore::alignmentForChild):
     34        (WebCore::RenderFlexibleBox::layoutAndPlaceChildren):
     35        (WebCore::RenderFlexibleBox::alignChildren):
     36        * rendering/style/RenderStyle.h:
     37        * rendering/style/RenderStyleConstants.h:
     38        * rendering/style/StyleFlexibleBoxData.cpp:
     39        (WebCore::StyleFlexibleBoxData::StyleFlexibleBoxData):
     40        (WebCore::StyleFlexibleBoxData::operator==):
     41        * rendering/style/StyleFlexibleBoxData.h:
     42        (StyleFlexibleBoxData): Move member variables to StyleRareNonInheritedData
     43        because these values will eventually apply to more than just flexbox.
     44        * rendering/style/StyleRareNonInheritedData.cpp:
     45        (WebCore::StyleRareNonInheritedData::StyleRareNonInheritedData):
     46        (WebCore::StyleRareNonInheritedData::operator==):
     47        * rendering/style/StyleRareNonInheritedData.h:
     48        (StyleRareNonInheritedData):
     49
    1502012-05-31  Ami Fischman  <fischman@chromium.org>
    251

  • trunk/Source/WebCore/css/CSSComputedStyleDeclaration.cpp

    r119097 r119131  
    229229#endif
    230230#if ENABLE(CSS3_FLEXBOX)
     231    CSSPropertyWebkitAlignItems,
     232    CSSPropertyWebkitAlignSelf,
    231233    CSSPropertyWebkitFlex,
    232234    CSSPropertyWebkitFlexOrder,
    233235    CSSPropertyWebkitFlexPack,
    234     CSSPropertyWebkitFlexAlign,
    235     CSSPropertyWebkitFlexItemAlign,
    236236    CSSPropertyWebkitFlexDirection,
    237237    CSSPropertyWebkitFlexFlow,
    … …  
    16551655        case CSSPropertyWebkitFlexPack:
    16561656            return cssValuePool().createValue(style->flexPack());
    1657         case CSSPropertyWebkitFlexAlign:
    1658             return cssValuePool().createValue(style->flexAlign());
    1659         case CSSPropertyWebkitFlexItemAlign:
    1660             if (style->flexItemAlign() == AlignAuto) {
     1657        case CSSPropertyWebkitAlignItems:
     1658            return cssValuePool().createValue(style->alignItems());
     1659        case CSSPropertyWebkitAlignSelf:
     1660            if (style->alignSelf() == AlignAuto) {
    16611661                if (m_node && m_node->parentNode() && m_node->parentNode()->computedStyle())
    1662                     return cssValuePool().createValue(m_node->parentNode()->computedStyle()->flexAlign());
     1662                    return cssValuePool().createValue(m_node->parentNode()->computedStyle()->alignItems());
    16631663                return cssValuePool().createValue(AlignStretch);
    16641664            }
    1665             return cssValuePool().createValue(style->flexItemAlign());
     1665            return cssValuePool().createValue(style->alignSelf());
    16661666        case CSSPropertyWebkitFlexDirection:
    16671667            return cssValuePool().createValue(style->flexDirection());

  • trunk/Source/WebCore/css/CSSParser.cpp

    r119097 r119131  
    690690        break;
    691691#if ENABLE(CSS3_FLEXBOX)
    692     case CSSPropertyWebkitFlexAlign:
     692    case CSSPropertyWebkitAlignItems:
    693693        if (valueID == CSSValueStart || valueID == CSSValueEnd || valueID == CSSValueCenter || valueID == CSSValueBaseline || valueID == CSSValueStretch)
     694            return true;
     695        break;
     696    case CSSPropertyWebkitAlignSelf:
     697        if (valueID == CSSValueAuto || valueID == CSSValueStart || valueID == CSSValueEnd || valueID == CSSValueCenter || valueID == CSSValueBaseline || valueID == CSSValueStretch)
    694698            return true;
    695699        break;
    … …  
    697701        if (valueID == CSSValueRow || valueID == CSSValueRowReverse || valueID == CSSValueColumn || valueID == CSSValueColumnReverse)
    698702                return true;
    699         break;
    700     case CSSPropertyWebkitFlexItemAlign:
    701         if (valueID == CSSValueAuto || valueID == CSSValueStart || valueID == CSSValueEnd || valueID == CSSValueCenter || valueID == CSSValueBaseline || valueID == CSSValueStretch)
    702             return true;
    703703        break;
    704704    case CSSPropertyWebkitFlexLinePack:
    … …  
    921921    case CSSPropertyWebkitColumnRuleStyle:
    922922#if ENABLE(CSS3_FLEXBOX)
    923     case CSSPropertyWebkitFlexAlign:
     923    case CSSPropertyWebkitAlignItems:
     924    case CSSPropertyWebkitAlignSelf:
    924925    case CSSPropertyWebkitFlexDirection:
    925     case CSSPropertyWebkitFlexItemAlign:
    926926    case CSSPropertyWebkitFlexLinePack:
    927927    case CSSPropertyWebkitFlexPack:
    … …  
    25552555    case CSSPropertyWebkitColumnRuleStyle:
    25562556#if ENABLE(CSS3_FLEXBOX)
    2557     case CSSPropertyWebkitFlexAlign:
     2557    case CSSPropertyWebkitAlignItems:
     2558    case CSSPropertyWebkitAlignSelf:
    25582559    case CSSPropertyWebkitFlexDirection:
    2559     case CSSPropertyWebkitFlexItemAlign:
    25602560    case CSSPropertyWebkitFlexLinePack:
    25612561    case CSSPropertyWebkitFlexPack:

  • trunk/Source/WebCore/css/CSSPrimitiveValueMappings.h

    r118971 r119131  
    11981198#if ENABLE(CSS3_FLEXBOX)
    11991199
    1200 template<> inline CSSPrimitiveValue::CSSPrimitiveValue(EFlexAlign e)
     1200template<> inline CSSPrimitiveValue::CSSPrimitiveValue(EAlignItems e)
    12011201    : CSSValue(PrimitiveClass)
    12021202{
    … …  
    12241224}
    12251225
    1226 template<> inline CSSPrimitiveValue::operator EFlexAlign() const
     1226template<> inline CSSPrimitiveValue::operator EAlignItems() const
    12271227{
    12281228    switch (m_value.ident) {

  • trunk/Source/WebCore/css/CSSProperty.cpp

    r118853 r119131  
    540540#endif
    541541#if ENABLE(CSS3_FLEXBOX)
     542    case CSSPropertyWebkitAlignItems:
     543    case CSSPropertyWebkitAlignSelf:
    542544    case CSSPropertyWebkitFlex:
    543545    case CSSPropertyWebkitFlexOrder:
    544546    case CSSPropertyWebkitFlexPack:
    545     case CSSPropertyWebkitFlexAlign:
    546     case CSSPropertyWebkitFlexItemAlign:
    547547    case CSSPropertyWebkitFlexDirection:
    548548    case CSSPropertyWebkitFlexFlow:

  • trunk/Source/WebCore/css/CSSPropertyNames.in

    r118853 r119131  
    259259#endif
    260260#if defined(ENABLE_CSS3_FLEXBOX) && ENABLE_CSS3_FLEXBOX
     261-webkit-align-items
     262-webkit-align-self
    261263-webkit-flex
    262 -webkit-flex-align
    263264-webkit-flex-direction
    264265-webkit-flex-flow
    265 -webkit-flex-item-align
    266266-webkit-flex-line-pack
    267267-webkit-flex-order

  • trunk/Source/WebCore/css/StyleBuilder.cpp

    r118853 r119131  
    19341934    setPropertyHandler(CSSPropertyWebkitColumnWidth, ApplyPropertyAuto<float, &RenderStyle::columnWidth, &RenderStyle::setColumnWidth, &RenderStyle::hasAutoColumnWidth, &RenderStyle::setHasAutoColumnWidth, ComputeLength>::createHandler());
    19351935#if ENABLE(CSS3_FLEXBOX)
     1936    setPropertyHandler(CSSPropertyWebkitAlignItems, ApplyPropertyDefault<EAlignItems, &RenderStyle::alignItems, EAlignItems, &RenderStyle::setAlignItems, EAlignItems, &RenderStyle::initialAlignItems>::createHandler());
     1937    setPropertyHandler(CSSPropertyWebkitAlignSelf, ApplyPropertyDefault<EAlignItems, &RenderStyle::alignSelf, EAlignItems, &RenderStyle::setAlignSelf, EAlignItems, &RenderStyle::initialAlignSelf>::createHandler());
    19361938    setPropertyHandler(CSSPropertyWebkitFlex, ApplyPropertyFlex::createHandler());
    1937     setPropertyHandler(CSSPropertyWebkitFlexAlign, ApplyPropertyDefault<EFlexAlign, &RenderStyle::flexAlign, EFlexAlign, &RenderStyle::setFlexAlign, EFlexAlign, &RenderStyle::initialFlexAlign>::createHandler());
    19381939    setPropertyHandler(CSSPropertyWebkitFlexDirection, ApplyPropertyDefault<EFlexDirection, &RenderStyle::flexDirection, EFlexDirection, &RenderStyle::setFlexDirection, EFlexDirection, &RenderStyle::initialFlexDirection>::createHandler());
    19391940    setPropertyHandler(CSSPropertyWebkitFlexFlow, ApplyPropertyExpanding<SuppressValue, CSSPropertyWebkitFlexDirection, CSSPropertyWebkitFlexWrap>::createHandler());
    1940     setPropertyHandler(CSSPropertyWebkitFlexItemAlign, ApplyPropertyDefault<EFlexAlign, &RenderStyle::flexItemAlign, EFlexAlign, &RenderStyle::setFlexItemAlign, EFlexAlign, &RenderStyle::initialFlexItemAlign>::createHandler());
    19411941    setPropertyHandler(CSSPropertyWebkitFlexLinePack, ApplyPropertyDefault<EFlexLinePack, &RenderStyle::flexLinePack, EFlexLinePack, &RenderStyle::setFlexLinePack, EFlexLinePack, &RenderStyle::initialFlexLinePack>::createHandler());
    19421942    setPropertyHandler(CSSPropertyWebkitFlexOrder, ApplyPropertyDefault<int, &RenderStyle::flexOrder, int, &RenderStyle::setFlexOrder, int, &RenderStyle::initialFlexOrder>::createHandler());

  • trunk/Source/WebCore/css/StyleResolver.cpp

    r119094 r119131  
    41224122    case CSSPropertyWebkitColumnWidth:
    41234123#if ENABLE(CSS3_FLEXBOX)
     4124    case CSSPropertyWebkitAlignItems:
     4125    case CSSPropertyWebkitAlignSelf:
    41244126    case CSSPropertyWebkitFlex:
    4125     case CSSPropertyWebkitFlexAlign:
    41264127    case CSSPropertyWebkitFlexDirection:
    41274128    case CSSPropertyWebkitFlexFlow:
    4128     case CSSPropertyWebkitFlexItemAlign:
    41294129    case CSSPropertyWebkitFlexLinePack:
    41304130    case CSSPropertyWebkitFlexOrder:

  • trunk/Source/WebCore/rendering/RenderBox.cpp

    r118961 r119131  
    17921792        if (!parent()->style()->isColumnFlexDirection() || parent()->style()->flexWrap() != FlexWrapNone)
    17931793            return true;
    1794         EFlexAlign itemAlign = style()->flexItemAlign();
    1795         if (itemAlign != AlignStretch && (itemAlign != AlignAuto || parent()->style()->flexAlign() != AlignStretch))
     1794        EAlignItems itemAlign = style()->alignSelf();
     1795        if (itemAlign != AlignStretch && (itemAlign != AlignAuto || parent()->style()->alignItems() != AlignStretch))
    17961796            return true;
    17971797    }

  • trunk/Source/WebCore/rendering/RenderFlexibleBox.cpp

    r119015 r119131  
    954954}
    955955
    956 static EFlexAlign flexAlignForChild(RenderBox* child)
    957 {
    958     EFlexAlign align = child->style()->flexItemAlign();
     956static EAlignItems alignmentForChild(RenderBox* child)
     957{
     958    EAlignItems align = child->style()->alignSelf();
    959959    if (align == AlignAuto)
    960         align = child->parent()->style()->flexAlign();
     960        align = child->parent()->style()->alignItems();
    961961
    962962    if (child->parent()->style()->flexWrap() == FlexWrapReverse) {
    … …  
    981981
    982982    LayoutUnit totalMainExtent = mainAxisExtent();
    983     LayoutUnit maxAscent = 0, maxDescent = 0; // Used when flex-align: baseline.
     983    LayoutUnit maxAscent = 0, maxDescent = 0; // Used when align-items: baseline.
    984984    LayoutUnit maxChildCrossAxisExtent = 0;
    985985    bool shouldFlipMainAxis = !isColumnFlow() && !isLeftToRightFlow();
    … …  
    10001000
    10011001        LayoutUnit childCrossAxisMarginBoxExtent;
    1002         if (flexAlignForChild(child) == AlignBaseline && !hasAutoMarginsInCrossAxis(child)) {
     1002        if (alignmentForChild(child) == AlignBaseline && !hasAutoMarginsInCrossAxis(child)) {
    10031003            LayoutUnit ascent = marginBoxAscentForChild(child);
    10041004            LayoutUnit descent = (crossAxisMarginExtentForChild(child) + crossAxisExtentForChild(child)) - ascent;
    … …  
    11561156                continue;
    11571157
    1158             switch (flexAlignForChild(child)) {
     1158            switch (alignmentForChild(child)) {
    11591159            case AlignAuto:
    11601160                ASSERT_NOT_REACHED();
    … …  
    11991199        for (size_t childNumber = 0; childNumber < lineContexts[lineNumber].numberOfChildren; ++childNumber, child = iterator.next()) {
    12001200            ASSERT(child);
    1201             if (flexAlignForChild(child) == AlignBaseline && !hasAutoMarginsInCrossAxis(child) && minMarginAfterBaseline)
     1201            if (alignmentForChild(child) == AlignBaseline && !hasAutoMarginsInCrossAxis(child) && minMarginAfterBaseline)
    12021202                adjustAlignmentForChild(child, minMarginAfterBaseline);
    12031203        }

  • trunk/Source/WebCore/rendering/style/RenderStyle.h

    r118853 r119131  
    810810    int flexOrder() const { return rareNonInheritedData->m_flexibleBox->m_flexOrder; }
    811811    EFlexPack flexPack() const { return static_cast<EFlexPack>(rareNonInheritedData->m_flexibleBox->m_flexPack); }
    812     EFlexAlign flexAlign() const { return static_cast<EFlexAlign>(rareNonInheritedData->m_flexibleBox->m_flexAlign); }
    813     EFlexAlign flexItemAlign() const { return static_cast<EFlexAlign>(rareNonInheritedData->m_flexibleBox->m_flexItemAlign); }
     812    EAlignItems alignItems() const { return static_cast<EAlignItems>(rareNonInheritedData->m_alignItems); }
     813    EAlignItems alignSelf() const { return static_cast<EAlignItems>(rareNonInheritedData->m_alignSelf); }
    814814    EFlexDirection flexDirection() const { return static_cast<EFlexDirection>(rareNonInheritedData->m_flexibleBox->m_flexDirection); }
    815815    bool isColumnFlexDirection() const { return flexDirection() == FlowColumn || flexDirection() == FlowColumnReverse; }
    … …  
    12521252    void setFlexOrder(int o) { SET_VAR(rareNonInheritedData.access()->m_flexibleBox, m_flexOrder, o); }
    12531253    void setFlexPack(EFlexPack p) { SET_VAR(rareNonInheritedData.access()->m_flexibleBox, m_flexPack, p); }
    1254     void setFlexAlign(EFlexAlign a) { SET_VAR(rareNonInheritedData.access()->m_flexibleBox, m_flexAlign, a); }
    1255     void setFlexItemAlign(EFlexAlign a) { SET_VAR(rareNonInheritedData.access()->m_flexibleBox, m_flexItemAlign, a); }
     1254    void setAlignItems(EAlignItems a) { SET_VAR(rareNonInheritedData, m_alignItems, a); }
     1255    void setAlignSelf(EAlignItems a) { SET_VAR(rareNonInheritedData, m_alignSelf, a); }
    12561256    void setFlexDirection(EFlexDirection direction) { SET_VAR(rareNonInheritedData.access()->m_flexibleBox, m_flexDirection, direction); }
    12571257    void setFlexWrap(EFlexWrap w) { SET_VAR(rareNonInheritedData.access()->m_flexibleBox, m_flexWrap, w); }
    … …  
    15861586    static int initialFlexOrder() { return 0; }
    15871587    static EFlexPack initialFlexPack() { return PackStart; }
    1588     static EFlexAlign initialFlexAlign() { return AlignStretch; }
    1589     static EFlexAlign initialFlexItemAlign() { return AlignAuto; }
     1588    static EAlignItems initialAlignItems() { return AlignStretch; }
     1589    static EAlignItems initialAlignSelf() { return AlignAuto; }
    15901590    static EFlexDirection initialFlexDirection() { return FlowRow; }
    15911591    static EFlexWrap initialFlexWrap() { return FlexWrapNone; }

  • trunk/Source/WebCore/rendering/style/RenderStyleConstants.h

    r118971 r119131  
    174174// CSS3 Flexbox Properties
    175175
     176enum EAlignItems { AlignAuto, AlignStart, AlignEnd, AlignCenter, AlignStretch, AlignBaseline };
    176177enum EFlexPack { PackStart, PackEnd, PackCenter, PackSpaceBetween, PackSpaceAround };
    177 enum EFlexAlign { AlignAuto, AlignStart, AlignEnd, AlignCenter, AlignStretch, AlignBaseline };
    178178enum EFlexDirection { FlowRow, FlowRowReverse, FlowColumn, FlowColumnReverse };
    179179enum EFlexLinePack { LinePackStart, LinePackEnd, LinePackCenter, LinePackSpaceBetween, LinePackSpaceAround, LinePackStretch };

  • trunk/Source/WebCore/rendering/style/StyleFlexibleBoxData.cpp

    r113208 r119131  
    3737    , m_flexOrder(RenderStyle::initialFlexOrder())
    3838    , m_flexPack(RenderStyle::initialFlexPack())
    39     , m_flexAlign(RenderStyle::initialFlexAlign())
    40     , m_flexItemAlign(RenderStyle::initialFlexItemAlign())
    4139    , m_flexDirection(RenderStyle::initialFlexDirection())
    4240    , m_flexWrap(RenderStyle::initialFlexWrap())
    … …  
    5250    , m_flexOrder(o.m_flexOrder)
    5351    , m_flexPack(o.m_flexPack)
    54     , m_flexAlign(o.m_flexAlign)
    55     , m_flexItemAlign(o.m_flexItemAlign)
    5652    , m_flexDirection(o.m_flexDirection)
    5753    , m_flexWrap(o.m_flexWrap)
    … …  
    6359{
    6460    return m_positiveFlex == o.m_positiveFlex && m_negativeFlex == o.m_negativeFlex && m_preferredSize == o.m_preferredSize
    65         && m_flexOrder == o.m_flexOrder && m_flexPack == o.m_flexPack && m_flexAlign == o.m_flexAlign
    66         && m_flexItemAlign == o.m_flexItemAlign && m_flexDirection == o.m_flexDirection && m_flexWrap == o.m_flexWrap
    67         && m_flexLinePack == o.m_flexLinePack;
     61        && m_flexOrder == o.m_flexOrder && m_flexPack == o.m_flexPack  && m_flexDirection == o.m_flexDirection
     62        && m_flexWrap == o.m_flexWrap && m_flexLinePack == o.m_flexLinePack;
    6863}
    6964

  • trunk/Source/WebCore/rendering/style/StyleFlexibleBoxData.h

    r113208 r119131  
    5252
    5353    unsigned m_flexPack : 3; // EFlexPack
    54     unsigned m_flexAlign : 3; // EFlexAlign
    55     unsigned m_flexItemAlign : 3; // EFlexAlign
    5654    unsigned m_flexDirection : 2; // EFlexDirection
    5755    unsigned m_flexWrap : 2; // EFlexWrap

  • trunk/Source/WebCore/rendering/style/StyleRareNonInheritedData.cpp

    r118396 r119131  
    6060    , m_transformStyle3D(RenderStyle::initialTransformStyle3D())
    6161    , m_backfaceVisibility(RenderStyle::initialBackfaceVisibility())
     62    , m_alignItems(RenderStyle::initialAlignItems())
     63    , m_alignSelf(RenderStyle::initialAlignSelf())
    6264    , userDrag(RenderStyle::initialUserDrag())
    6365    , textOverflow(RenderStyle::initialTextOverflow())
    … …  
    127129    , m_transformStyle3D(o.m_transformStyle3D)
    128130    , m_backfaceVisibility(o.m_backfaceVisibility)
     131    , m_alignItems(o.m_alignItems)
     132    , m_alignSelf(o.m_alignSelf)
    129133    , userDrag(o.userDrag)
    130134    , textOverflow(o.textOverflow)
    … …  
    200204        && m_transformStyle3D == o.m_transformStyle3D
    201205        && m_backfaceVisibility == o.m_backfaceVisibility
     206        && m_alignItems == o.m_alignItems
     207        && m_alignSelf == o.m_alignSelf
    202208        && userDrag == o.userDrag
    203209        && textOverflow == o.textOverflow

  • trunk/Source/WebCore/rendering/style/StyleRareNonInheritedData.h

    r118396 r119131  
    159159    unsigned m_backfaceVisibility : 1; // EBackfaceVisibility
    160160
     161    unsigned m_alignItems : 3; // EAlignItems
     162    unsigned m_alignSelf : 3; // EAlignItems
     163
    161164    unsigned userDrag : 2; // EUserDrag
    162165    unsigned textOverflow : 1; // Whether or not lines that spill out should be truncated with "..."
Note: See TracChangeset for help on using the changeset viewer.