src/third_party/WebKit/LayoutTests/css3/flexbox/multiline-justify-content.html

   1 <!DOCTYPE html>
   2 <html>
   3 <style>
   4 .flexbox {
   5     position: relative;
   6     display: -webkit-flex;
   7     background-color: grey;
   8     max-width: 100px;
   9     -webkit-align-content: flex-start;
  10 }
  11 .flexbox > * {
  12     -webkit-flex: none;
  13 }
  14 .title {
  15     margin-top: 1em;
  16 }
  17 .ltr {
  18     direction: ltr;
  19 }
  20 .rtl {
  21     direction: rtl;
  22 }
  23 .horizontal-tb {
  24     -webkit-writing-mode: horizontal-tb;
  25 }
  26 .horizontal-bt {
  27     -webkit-writing-mode: horizontal-bt;
  28 }
  29 .vertical-rl {
  30     -webkit-writing-mode: vertical-rl;
  31 }
  32 .vertical-lr {
  33     -webkit-writing-mode: vertical-lr;
  34 }
  35 .row {
  36     -webkit-flex-flow: row;
  37 }
  38 .row-reverse {
  39     -webkit-flex-flow: row-reverse;
  40 }
  41 .column {
  42     -webkit-flex-flow: column;
  43 }
  44 .column-reverse {
  45     -webkit-flex-flow: column-reverse;
  46 }
  47 .wrap {
  48     -webkit-flex-wrap: wrap;
  49 }
  50 .wrap-reverse {
  51     -webkit-flex-wrap: wrap-reverse;
  52 }
  53 .justify-content-flex-start {
  54     -webkit-justify-content: flex-start;
  55 }
  56 .justify-content-flex-end {
  57     -webkit-justify-content: flex-end;
  58 }
  59 .justify-content-center {
  60     -webkit-justify-content: center;
  61 }
  62 .justify-content-space-between {
  63     -webkit-justify-content: space-between;
  64 }
  65 .justify-content-space-around {
  66     -webkit-justify-content: space-around;
  67 }
  68 .flexbox > :nth-child(1) {
  69     background-color: #0f0;
  70 }
  71 .flexbox > :nth-child(2) {
  72     background-color: #090;
  73 }
  74 .flexbox > :nth-child(3) {
  75     background-color: #00f;
  76 }
  77 .flexbox > :nth-child(4) {
  78     background-color: #009;
  79 }
  80 </style>
  81 <script src="../../resources/check-layout.js"></script>
  82 <body onload="checkLayout('.flexbox')">
  83
  84 <script>
  85 var expectations = {
  86     'horizontal-tb': {
  87         'row': {
  88             'ltr': {
  89                 'wrap': {
  90                     'flex-start': {
  91                         'flexbox': [80, 20],
  92                         'child1': [40, 10, 0, 0],
  93                         'child2': [20, 10, 40, 0],
  94                         'child3': [40, 10, 0, 10],
  95                         'child4': [20, 10, 40, 10],
  96                     },
  97                     'flex-end': {
  98                         'flexbox': [80, 20],
  99                         'child1': [40, 10, 20, 0],
 100                         'child2': [20, 10, 60, 0],
 101                         'child3': [40, 10, 20, 10],
 102                         'child4': [20, 10, 60, 10],
 103                     },
 104                     'center': {
 105                         'flexbox': [80, 20],
 106                         'child1': [40, 10, 10, 0],
 107                         'child2': [20, 10, 50, 0],
 108                         'child3': [40, 10, 10, 10],
 109                         'child4': [20, 10, 50, 10],
 110                     },
 111                     'space-between': {
 112                         'flexbox': [80, 20],
 113                         'child1': [40, 10, 0, 0],
 114                         'child2': [20, 10, 60, 0],
 115                         'child3': [40, 10, 0, 10],
 116                         'child4': [20, 10, 60, 10],
 117                     },
 118                     'space-around': {
 119                         'flexbox': [80, 20],
 120                         'child1': [40, 10, 5, 0],
 121                         'child2': [20, 10, 55, 0],
 122                         'child3': [40, 10, 5, 10],
 123                         'child4': [20, 10, 55, 10],
 124                     },
 125                 },
 126                 'wrap-reverse': {
 127                     'flex-start': {
 128                         'flexbox': [80, 20],
 129                         'child1': [40, 10, 0, 10],
 130                         'child2': [20, 10, 40, 10],
 131                         'child3': [40, 10, 0, 0],
 132                         'child4': [20, 10, 40, 0],
 133                     },
 134                     'flex-end': {
 135                         'flexbox': [80, 20],
 136                         'child1': [40, 10, 20, 10],
 137                         'child2': [20, 10, 60, 10],
 138                         'child3': [40, 10, 20, 0],
 139                         'child4': [20, 10, 60, 0],
 140                     },
 141                     'center': {
 142                         'flexbox': [80, 20],
 143                         'child1': [40, 10, 10, 10],
 144                         'child2': [20, 10, 50, 10],
 145                         'child3': [40, 10, 10, 0],
 146                         'child4': [20, 10, 50, 0],
 147                     },
 148                     'space-between': {
 149                         'flexbox': [80, 20],
 150                         'child1': [40, 10, 0, 10],
 151                         'child2': [20, 10, 60, 10],
 152                         'child3': [40, 10, 0, 0],
 153                         'child4': [20, 10, 60, 0],
 154                     },
 155                     'space-around': {
 156                         'flexbox': [80, 20],
 157                         'child1': [40, 10, 5, 10],
 158                         'child2': [20, 10, 55, 10],
 159                         'child3': [40, 10, 5, 0],
 160                         'child4': [20, 10, 55, 0],
 161                     },
 162                 },
 163             },
 164             'rtl': {
 165                 'wrap': {
 166                     'flex-start': {
 167                         'flexbox': [80, 20],
 168                         'child1': [40, 10, 40, 0],
 169                         'child2': [20, 10, 20, 0],
 170                         'child3': [40, 10, 40, 10],
 171                         'child4': [20, 10, 20, 10],
 172                     },
 173                     'flex-end': {
 174                         'flexbox': [80, 20],
 175                         'child1': [40, 10, 20, 0],
 176                         'child2': [20, 10, 0, 0],
 177                         'child3': [40, 10, 20, 10],
 178                         'child4': [20, 10, 0, 10],
 179                     },
 180                     'center': {
 181                         'flexbox': [80, 20],
 182                         'child1': [40, 10, 30, 0],
 183                         'child2': [20, 10, 10, 0],
 184                         'child3': [40, 10, 30, 10],
 185                         'child4': [20, 10, 10, 10],
 186                     },
 187                     'space-between': {
 188                         'flexbox': [80, 20],
 189                         'child1': [40, 10, 40, 0],
 190                         'child2': [20, 10, 0, 0],
 191                         'child3': [40, 10, 40, 10],
 192                         'child4': [20, 10, 0, 10],
 193                     },
 194                     'space-around': {
 195                         'flexbox': [80, 20],
 196                         'child1': [40, 10, 35, 0],
 197                         'child2': [20, 10, 5, 0],
 198                         'child3': [40, 10, 35, 10],
 199                         'child4': [20, 10, 5, 10],
 200                     },
 201                 },
 202                 'wrap-reverse': {
 203                     'flex-start': {
 204                         'flexbox': [80, 20],
 205                         'child1': [40, 10, 40, 10],
 206                         'child2': [20, 10, 20, 10],
 207                         'child3': [40, 10, 40, 0],
 208                         'child4': [20, 10, 20, 0],
 209                     },
 210                     'flex-end': {
 211                         'flexbox': [80, 20],
 212                         'child1': [40, 10, 20, 10],
 213                         'child2': [20, 10, 0, 10],
 214                         'child3': [40, 10, 20, 0],
 215                         'child4': [20, 10, 0, 0],
 216                     },
 217                     'center': {
 218                         'flexbox': [80, 20],
 219                         'child1': [40, 10, 30, 10],
 220                         'child2': [20, 10, 10, 10],
 221                         'child3': [40, 10, 30, 0],
 222                         'child4': [20, 10, 10, 0],
 223                     },
 224                     'space-between': {
 225                         'flexbox': [80, 20],
 226                         'child1': [40, 10, 40, 10],
 227                         'child2': [20, 10, 0, 10],
 228                         'child3': [40, 10, 40, 0],
 229                         'child4': [20, 10, 0, 0],
 230                     },
 231                     'space-around': {
 232                         'flexbox': [80, 20],
 233                         'child1': [40, 10, 35, 10],
 234                         'child2': [20, 10, 5, 10],
 235                         'child3': [40, 10, 35, 0],
 236                         'child4': [20, 10, 5, 0],
 237                     },
 238                 },
 239             },
 240         },
 241         'column': {
 242             'ltr': {
 243                 'wrap': {
 244                     'flex-start': {
 245                         'flexbox': [100, 80],
 246                         'child1': [10, 40, 0, 0],
 247                         'child2': [10, 20, 0, 40],
 248                         'child3': [10, 40, 10, 0],
 249                         'child4': [10, 20, 10, 40],
 250                     },
 251                     'flex-end': {
 252                         'flexbox': [100, 80],
 253                         'child1': [10, 40, 0, 20],
 254                         'child2': [10, 20, 0, 60],
 255                         'child3': [10, 40, 10, 20],
 256                         'child4': [10, 20, 10, 60],
 257                     },
 258                     'center': {
 259                         'flexbox': [100, 80],
 260                         'child1': [10, 40, 0, 10],
 261                         'child2': [10, 20, 0, 50],
 262                         'child3': [10, 40, 10, 10],
 263                         'child4': [10, 20, 10, 50],
 264                     },
 265                     'space-between': {
 266                         'flexbox': [100, 80],
 267                         'child1': [10, 40, 0, 0],
 268                         'child2': [10, 20, 0, 60],
 269                         'child3': [10, 40, 10, 0],
 270                         'child4': [10, 20, 10, 60],
 271                     },
 272                     'space-around': {
 273                         'flexbox': [100, 80],
 274                         'child1': [10, 40, 0, 5],
 275                         'child2': [10, 20, 0, 55],
 276                         'child3': [10, 40, 10, 5],
 277                         'child4': [10, 20, 10, 55],
 278                     },
 279                 },
 280                 'wrap-reverse': {
 281                     'flex-start': {
 282                         'flexbox': [100, 80],
 283                         'child1': [10, 40, 90, 0],
 284                         'child2': [10, 20, 90, 40],
 285                         'child3': [10, 40, 80, 0],
 286                         'child4': [10, 20, 80, 40],
 287                     },
 288                     'flex-end': {
 289                         'flexbox': [100, 80],
 290                         'child1': [10, 40, 90, 20],
 291                         'child2': [10, 20, 90, 60],
 292                         'child3': [10, 40, 80, 20],
 293                         'child4': [10, 20, 80, 60],
 294                     },
 295                     'center': {
 296                         'flexbox': [100, 80],
 297                         'child1': [10, 40, 90, 10],
 298                         'child2': [10, 20, 90, 50],
 299                         'child3': [10, 40, 80, 10],
 300                         'child4': [10, 20, 80, 50],
 301                     },
 302                     'space-between': {
 303                         'flexbox': [100, 80],
 304                         'child1': [10, 40, 90, 0],
 305                         'child2': [10, 20, 90, 60],
 306                         'child3': [10, 40, 80, 0],
 307                         'child4': [10, 20, 80, 60],
 308                     },
 309                     'space-around': {
 310                         'flexbox': [100, 80],
 311                         'child1': [10, 40, 90, 5],
 312                         'child2': [10, 20, 90, 55],
 313                         'child3': [10, 40, 80, 5],
 314                         'child4': [10, 20, 80, 55],
 315                     },
 316                 },
 317             },
 318             'rtl': {
 319                 'wrap': {
 320                     'flex-start': {
 321                         'flexbox': [100, 80],
 322                         'child1': [10, 40, 90, 0],
 323                         'child2': [10, 20, 90, 40],
 324                         'child3': [10, 40, 80, 0],
 325                         'child4': [10, 20, 80, 40],
 326                     },
 327                     'flex-end': {
 328                         'flexbox': [100, 80],
 329                         'child1': [10, 40, 90, 20],
 330                         'child2': [10, 20, 90, 60],
 331                         'child3': [10, 40, 80, 20],
 332                         'child4': [10, 20, 80, 60],
 333                     },
 334                     'center': {
 335                         'flexbox': [100, 80],
 336                         'child1': [10, 40, 90, 10],
 337                         'child2': [10, 20, 90, 50],
 338                         'child3': [10, 40, 80, 10],
 339                         'child4': [10, 20, 80, 50],
 340                     },
 341                     'space-between': {
 342                         'flexbox': [100, 80],
 343                         'child1': [10, 40, 90, 0],
 344                         'child2': [10, 20, 90, 60],
 345                         'child3': [10, 40, 80, 0],
 346                         'child4': [10, 20, 80, 60],
 347                     },
 348                     'space-around': {
 349                         'flexbox': [100, 80],
 350                         'child1': [10, 40, 90, 5],
 351                         'child2': [10, 20, 90, 55],
 352                         'child3': [10, 40, 80, 5],
 353                         'child4': [10, 20, 80, 55],
 354                     },
 355                 },
 356                 'wrap-reverse': {
 357                     'flex-start': {
 358                         'flexbox': [100, 80],
 359                         'child1': [10, 40, 0, 0],
 360                         'child2': [10, 20, 0, 40],
 361                         'child3': [10, 40, 10, 0],
 362                         'child4': [10, 20, 10, 40],
 363                     },
 364                     'flex-end': {
 365                         'flexbox': [100, 80],
 366                         'child1': [10, 40, 0, 20],
 367                         'child2': [10, 20, 0, 60],
 368                         'child3': [10, 40, 10, 20],
 369                         'child4': [10, 20, 10, 60],
 370                     },
 371                     'center': {
 372                         'flexbox': [100, 80],
 373                         'child1': [10, 40, 0, 10],
 374                         'child2': [10, 20, 0, 50],
 375                         'child3': [10, 40, 10, 10],
 376                         'child4': [10, 20, 10, 50],
 377                     },
 378                     'space-between': {
 379                         'flexbox': [100, 80],
 380                         'child1': [10, 40, 0, 0],
 381                         'child2': [10, 20, 0, 60],
 382                         'child3': [10, 40, 10, 0],
 383                         'child4': [10, 20, 10, 60],
 384                     },
 385                     'space-around': {
 386                         'flexbox': [100, 80],
 387                         'child1': [10, 40, 0, 5],
 388                         'child2': [10, 20, 0, 55],
 389                         'child3': [10, 40, 10, 5],
 390                         'child4': [10, 20, 10, 55],
 391                     },
 392                 },
 393             },
 394         },
 395         'row-reverse': {
 396             'ltr': {
 397                 'wrap': {
 398                     'flex-start': {
 399                         'flexbox': [80, 20],
 400                         'child1': [40, 10, 40, 0],
 401                         'child2': [20, 10, 20, 0],
 402                         'child3': [40, 10, 40, 10],
 403                         'child4': [20, 10, 20, 10],
 404                     },
 405                     'flex-end': {
 406                         'flexbox': [80, 20],
 407                         'child1': [40, 10, 20, 0],
 408                         'child2': [20, 10, 0, 0],
 409                         'child3': [40, 10, 20, 10],
 410                         'child4': [20, 10, 0, 10],
 411                     },
 412                     'center': {
 413                         'flexbox': [80, 20],
 414                         'child1': [40, 10, 30, 0],
 415                         'child2': [20, 10, 10, 0],
 416                         'child3': [40, 10, 30, 10],
 417                         'child4': [20, 10, 10, 10],
 418                     },
 419                     'space-between': {
 420                         'flexbox': [80, 20],
 421                         'child1': [40, 10, 40, 0],
 422                         'child2': [20, 10, 0, 0],
 423                         'child3': [40, 10, 40, 10],
 424                         'child4': [20, 10, 0, 10],
 425                     },
 426                     'space-around': {
 427                         'flexbox': [80, 20],
 428                         'child1': [40, 10, 35, 0],
 429                         'child2': [20, 10, 5, 0],
 430                         'child3': [40, 10, 35, 10],
 431                         'child4': [20, 10, 5, 10],
 432                     },
 433                 },
 434                 'wrap-reverse': {
 435                     'flex-start': {
 436                         'flexbox': [80, 20],
 437                         'child1': [40, 10, 40, 10],
 438                         'child2': [20, 10, 20, 10],
 439                         'child3': [40, 10, 40, 0],
 440                         'child4': [20, 10, 20, 0],
 441                     },
 442                     'flex-end': {
 443                         'flexbox': [80, 20],
 444                         'child1': [40, 10, 20, 10],
 445                         'child2': [20, 10, 0, 10],
 446                         'child3': [40, 10, 20, 0],
 447                         'child4': [20, 10, 0, 0],
 448                     },
 449                     'center': {
 450                         'flexbox': [80, 20],
 451                         'child1': [40, 10, 30, 10],
 452                         'child2': [20, 10, 10, 10],
 453                         'child3': [40, 10, 30, 0],
 454                         'child4': [20, 10, 10, 0],
 455                     },
 456                     'space-between': {
 457                         'flexbox': [80, 20],
 458                         'child1': [40, 10, 40, 10],
 459                         'child2': [20, 10, 0, 10],
 460                         'child3': [40, 10, 40, 0],
 461                         'child4': [20, 10, 0, 0],
 462                     },
 463                     'space-around': {
 464                         'flexbox': [80, 20],
 465                         'child1': [40, 10, 35, 10],
 466                         'child2': [20, 10, 5, 10],
 467                         'child3': [40, 10, 35, 0],
 468                         'child4': [20, 10, 5, 0],
 469                     },
 470                 },
 471             },
 472             'rtl': {
 473                 'wrap': {
 474                     'flex-start': {
 475                         'flexbox': [80, 20],
 476                         'child1': [40, 10, 0, 0],
 477                         'child2': [20, 10, 40, 0],
 478                         'child3': [40, 10, 0, 10],
 479                         'child4': [20, 10, 40, 10],
 480                     },
 481                     'flex-end': {
 482                         'flexbox': [80, 20],
 483                         'child1': [40, 10, 20, 0],
 484                         'child2': [20, 10, 60, 0],
 485                         'child3': [40, 10, 20, 10],
 486                         'child4': [20, 10, 60, 10],
 487                     },
 488                     'center': {
 489                         'flexbox': [80, 20],
 490                         'child1': [40, 10, 10, 0],
 491                         'child2': [20, 10, 50, 0],
 492                         'child3': [40, 10, 10, 10],
 493                         'child4': [20, 10, 50, 10],
 494                     },
 495                     'space-between': {
 496                         'flexbox': [80, 20],
 497                         'child1': [40, 10, 0, 0],
 498                         'child2': [20, 10, 60, 0],
 499                         'child3': [40, 10, 0, 10],
 500                         'child4': [20, 10, 60, 10],
 501                     },
 502                     'space-around': {
 503                         'flexbox': [80, 20],
 504                         'child1': [40, 10, 5, 0],
 505                         'child2': [20, 10, 55, 0],
 506                         'child3': [40, 10, 5, 10],
 507                         'child4': [20, 10, 55, 10],
 508                     },
 509                 },
 510                 'wrap-reverse': {
 511                     'flex-start': {
 512                         'flexbox': [80, 20],
 513                         'child1': [40, 10, 0, 10],
 514                         'child2': [20, 10, 40, 10],
 515                         'child3': [40, 10, 0, 0],
 516                         'child4': [20, 10, 40, 0],
 517                     },
 518                     'flex-end': {
 519                         'flexbox': [80, 20],
 520                         'child1': [40, 10, 20, 10],
 521                         'child2': [20, 10, 60, 10],
 522                         'child3': [40, 10, 20, 0],
 523                         'child4': [20, 10, 60, 0],
 524                     },
 525                     'center': {
 526                         'flexbox': [80, 20],
 527                         'child1': [40, 10, 10, 10],
 528                         'child2': [20, 10, 50, 10],
 529                         'child3': [40, 10, 10, 0],
 530                         'child4': [20, 10, 50, 0],
 531                     },
 532                     'space-between': {
 533                         'flexbox': [80, 20],
 534                         'child1': [40, 10, 0, 10],
 535                         'child2': [20, 10, 60, 10],
 536                         'child3': [40, 10, 0, 0],
 537                         'child4': [20, 10, 60, 0],
 538                     },
 539                     'space-around': {
 540                         'flexbox': [80, 20],
 541                         'child1': [40, 10, 5, 10],
 542                         'child2': [20, 10, 55, 10],
 543                         'child3': [40, 10, 5, 0],
 544                         'child4': [20, 10, 55, 0],
 545                     },
 546                 },
 547             },
 548         },
 549         'column-reverse': {
 550             'ltr': {
 551                 'wrap': {
 552                     'flex-start': {
 553                         'flexbox': [100, 80],
 554                         'child1': [10, 40, 0, 40],
 555                         'child2': [10, 20, 0, 20],
 556                         'child3': [10, 40, 10, 40],
 557                         'child4': [10, 20, 10, 20],
 558                     },
 559                     'flex-end': {
 560                         'flexbox': [100, 80],
 561                         'child1': [10, 40, 0, 20],
 562                         'child2': [10, 20, 0, 0],
 563                         'child3': [10, 40, 10, 20],
 564                         'child4': [10, 20, 10, 0],
 565                     },
 566                     'center': {
 567                         'flexbox': [100, 80],
 568                         'child1': [10, 40, 0, 30],
 569                         'child2': [10, 20, 0, 10],
 570                         'child3': [10, 40, 10, 30],
 571                         'child4': [10, 20, 10, 10],
 572                     },
 573                     'space-between': {
 574                         'flexbox': [100, 80],
 575                         'child1': [10, 40, 0, 40],
 576                         'child2': [10, 20, 0, 0],
 577                         'child3': [10, 40, 10, 40],
 578                         'child4': [10, 20, 10, 0],
 579                     },
 580                     'space-around': {
 581                         'flexbox': [100, 80],
 582                         'child1': [10, 40, 0, 35],
 583                         'child2': [10, 20, 0, 5],
 584                         'child3': [10, 40, 10, 35],
 585                         'child4': [10, 20, 10, 5],
 586                     },
 587                 },
 588                 'wrap-reverse': {
 589                     'flex-start': {
 590                         'flexbox': [100, 80],
 591                         'child1': [10, 40, 90, 40],
 592                         'child2': [10, 20, 90, 20],
 593                         'child3': [10, 40, 80, 40],
 594                         'child4': [10, 20, 80, 20],
 595                     },
 596                     'flex-end': {
 597                         'flexbox': [100, 80],
 598                         'child1': [10, 40, 90, 20],
 599                         'child2': [10, 20, 90, 0],
 600                         'child3': [10, 40, 80, 20],
 601                         'child4': [10, 20, 80, 0],
 602                     },
 603                     'center': {
 604                         'flexbox': [100, 80],
 605                         'child1': [10, 40, 90, 30],
 606                         'child2': [10, 20, 90, 10],
 607                         'child3': [10, 40, 80, 30],
 608                         'child4': [10, 20, 80, 10],
 609                     },
 610                     'space-between': {
 611                         'flexbox': [100, 80],
 612                         'child1': [10, 40, 90, 40],
 613                         'child2': [10, 20, 90, 0],
 614                         'child3': [10, 40, 80, 40],
 615                         'child4': [10, 20, 80, 0],
 616                     },
 617                     'space-around': {
 618                         'flexbox': [100, 80],
 619                         'child1': [10, 40, 90, 35],
 620                         'child2': [10, 20, 90, 5],
 621                         'child3': [10, 40, 80, 35],
 622                         'child4': [10, 20, 80, 5],
 623                     },
 624                 },
 625             },
 626             'rtl': {
 627                 'wrap': {
 628                     'flex-start': {
 629                         'flexbox': [100, 80],
 630                         'child1': [10, 40, 90, 40],
 631                         'child2': [10, 20, 90, 20],
 632                         'child3': [10, 40, 80, 40],
 633                         'child4': [10, 20, 80, 20],
 634                     },
 635                     'flex-end': {
 636                         'flexbox': [100, 80],
 637                         'child1': [10, 40, 90, 20],
 638                         'child2': [10, 20, 90, 0],
 639                         'child3': [10, 40, 80, 20],
 640                         'child4': [10, 20, 80, 0],
 641                     },
 642                     'center': {
 643                         'flexbox': [100, 80],
 644                         'child1': [10, 40, 90, 30],
 645                         'child2': [10, 20, 90, 10],
 646                         'child3': [10, 40, 80, 30],
 647                         'child4': [10, 20, 80, 10],
 648                     },
 649                     'space-between': {
 650                         'flexbox': [100, 80],
 651                         'child1': [10, 40, 90, 40],
 652                         'child2': [10, 20, 90, 0],
 653                         'child3': [10, 40, 80, 40],
 654                         'child4': [10, 20, 80, 0],
 655                     },
 656                     'space-around': {
 657                         'flexbox': [100, 80],
 658                         'child1': [10, 40, 90, 35],
 659                         'child2': [10, 20, 90, 5],
 660                         'child3': [10, 40, 80, 35],
 661                         'child4': [10, 20, 80, 5],
 662                     },
 663                 },
 664                 'wrap-reverse': {
 665                     'flex-start': {
 666                         'flexbox': [100, 80],
 667                         'child1': [10, 40, 0, 40],
 668                         'child2': [10, 20, 0, 20],
 669                         'child3': [10, 40, 10, 40],
 670                         'child4': [10, 20, 10, 20],
 671                     },
 672                     'flex-end': {
 673                         'flexbox': [100, 80],
 674                         'child1': [10, 40, 0, 20],
 675                         'child2': [10, 20, 0, 0],
 676                         'child3': [10, 40, 10, 20],
 677                         'child4': [10, 20, 10, 0],
 678                     },
 679                     'center': {
 680                         'flexbox': [100, 80],
 681                         'child1': [10, 40, 0, 30],
 682                         'child2': [10, 20, 0, 10],
 683                         'child3': [10, 40, 10, 30],
 684                         'child4': [10, 20, 10, 10],
 685                     },
 686                     'space-between': {
 687                         'flexbox': [100, 80],
 688                         'child1': [10, 40, 0, 40],
 689                         'child2': [10, 20, 0, 0],
 690                         'child3': [10, 40, 10, 40],
 691                         'child4': [10, 20, 10, 0],
 692                     },
 693                     'space-around': {
 694                         'flexbox': [100, 80],
 695                         'child1': [10, 40, 0, 35],
 696                         'child2': [10, 20, 0, 5],
 697                         'child3': [10, 40, 10, 35],
 698                         'child4': [10, 20, 10, 5],
 699                     },
 700                 },
 701             },
 702         },
 703     },
 704     'horizontal-bt': {
 705         'row': {
 706             'ltr': {
 707                 'wrap': {
 708                     'flex-start': {
 709                         'flexbox': [80, 20],
 710                         'child1': [40, 10, 0, 10],
 711                         'child2': [20, 10, 40, 10],
 712                         'child3': [40, 10, 0, 0],
 713                         'child4': [20, 10, 40, 0],
 714                     },
 715                     'flex-end': {
 716                         'flexbox': [80, 20],
 717                         'child1': [40, 10, 20, 10],
 718                         'child2': [20, 10, 60, 10],
 719                         'child3': [40, 10, 20, 0],
 720                         'child4': [20, 10, 60, 0],
 721                     },
 722                     'center': {
 723                         'flexbox': [80, 20],
 724                         'child1': [40, 10, 10, 10],
 725                         'child2': [20, 10, 50, 10],
 726                         'child3': [40, 10, 10, 0],
 727                         'child4': [20, 10, 50, 0],
 728                     },
 729                     'space-between': {
 730                         'flexbox': [80, 20],
 731                         'child1': [40, 10, 0, 10],
 732                         'child2': [20, 10, 60, 10],
 733                         'child3': [40, 10, 0, 0],
 734                         'child4': [20, 10, 60, 0],
 735                     },
 736                     'space-around': {
 737                         'flexbox': [80, 20],
 738                         'child1': [40, 10, 5, 10],
 739                         'child2': [20, 10, 55, 10],
 740                         'child3': [40, 10, 5, 0],
 741                         'child4': [20, 10, 55, 0],
 742                     },
 743                 },
 744                 'wrap-reverse': {
 745                     'flex-start': {
 746                         'flexbox': [80, 20],
 747                         'child1': [40, 10, 0, 0],
 748                         'child2': [20, 10, 40, 0],
 749                         'child3': [40, 10, 0, 10],
 750                         'child4': [20, 10, 40, 10],
 751                     },
 752                     'flex-end': {
 753                         'flexbox': [80, 20],
 754                         'child1': [40, 10, 20, 0],
 755                         'child2': [20, 10, 60, 0],
 756                         'child3': [40, 10, 20, 10],
 757                         'child4': [20, 10, 60, 10],
 758                     },
 759                     'center': {
 760                         'flexbox': [80, 20],
 761                         'child1': [40, 10, 10, 0],
 762                         'child2': [20, 10, 50, 0],
 763                         'child3': [40, 10, 10, 10],
 764                         'child4': [20, 10, 50, 10],
 765                     },
 766                     'space-between': {
 767                         'flexbox': [80, 20],
 768                         'child1': [40, 10, 0, 0],
 769                         'child2': [20, 10, 60, 0],
 770                         'child3': [40, 10, 0, 10],
 771                         'child4': [20, 10, 60, 10],
 772                     },
 773                     'space-around': {
 774                         'flexbox': [80, 20],
 775                         'child1': [40, 10, 5, 0],
 776                         'child2': [20, 10, 55, 0],
 777                         'child3': [40, 10, 5, 10],
 778                         'child4': [20, 10, 55, 10],
 779                     },
 780                 },
 781             },
 782             'rtl': {
 783                 'wrap': {
 784                     'flex-start': {
 785                         'flexbox': [80, 20],
 786                         'child1': [40, 10, 40, 10],
 787                         'child2': [20, 10, 20, 10],
 788                         'child3': [40, 10, 40, 0],
 789                         'child4': [20, 10, 20, 0],
 790                     },
 791                     'flex-end': {
 792                         'flexbox': [80, 20],
 793                         'child1': [40, 10, 20, 10],
 794                         'child2': [20, 10, 0, 10],
 795                         'child3': [40, 10, 20, 0],
 796                         'child4': [20, 10, 0, 0],
 797                     },
 798                     'center': {
 799                         'flexbox': [80, 20],
 800                         'child1': [40, 10, 30, 10],
 801                         'child2': [20, 10, 10, 10],
 802                         'child3': [40, 10, 30, 0],
 803                         'child4': [20, 10, 10, 0],
 804                     },
 805                     'space-between': {
 806                         'flexbox': [80, 20],
 807                         'child1': [40, 10, 40, 10],
 808                         'child2': [20, 10, 0, 10],
 809                         'child3': [40, 10, 40, 0],
 810                         'child4': [20, 10, 0, 0],
 811                     },
 812                     'space-around': {
 813                         'flexbox': [80, 20],
 814                         'child1': [40, 10, 35, 10],
 815                         'child2': [20, 10, 5, 10],
 816                         'child3': [40, 10, 35, 0],
 817                         'child4': [20, 10, 5, 0],
 818                     },
 819                 },
 820                 'wrap-reverse': {
 821                     'flex-start': {
 822                         'flexbox': [80, 20],
 823                         'child1': [40, 10, 40, 0],
 824                         'child2': [20, 10, 20, 0],
 825                         'child3': [40, 10, 40, 10],
 826                         'child4': [20, 10, 20, 10],
 827                     },
 828                     'flex-end': {
 829                         'flexbox': [80, 20],
 830                         'child1': [40, 10, 20, 0],
 831                         'child2': [20, 10, 0, 0],
 832                         'child3': [40, 10, 20, 10],
 833                         'child4': [20, 10, 0, 10],
 834                     },
 835                     'center': {
 836                         'flexbox': [80, 20],
 837                         'child1': [40, 10, 30, 0],
 838                         'child2': [20, 10, 10, 0],
 839                         'child3': [40, 10, 30, 10],
 840                         'child4': [20, 10, 10, 10],
 841                     },
 842                     'space-between': {
 843                         'flexbox': [80, 20],
 844                         'child1': [40, 10, 40, 0],
 845                         'child2': [20, 10, 0, 0],
 846                         'child3': [40, 10, 40, 10],
 847                         'child4': [20, 10, 0, 10],
 848                     },
 849                     'space-around': {
 850                         'flexbox': [80, 20],
 851                         'child1': [40, 10, 35, 0],
 852                         'child2': [20, 10, 5, 0],
 853                         'child3': [40, 10, 35, 10],
 854                         'child4': [20, 10, 5, 10],
 855                     },
 856                 },
 857             },
 858         },
 859         'column': {
 860             'ltr': {
 861                 'wrap': {
 862                     'flex-start': {
 863                         'flexbox': [100, 80],
 864                         'child1': [10, 40, 0, 40],
 865                         'child2': [10, 20, 0, 20],
 866                         'child3': [10, 40, 10, 40],
 867                         'child4': [10, 20, 10, 20],
 868                     },
 869                     'flex-end': {
 870                         'flexbox': [100, 80],
 871                         'child1': [10, 40, 0, 20],
 872                         'child2': [10, 20, 0, 0],
 873                         'child3': [10, 40, 10, 20],
 874                         'child4': [10, 20, 10, 0],
 875                     },
 876                     'center': {
 877                         'flexbox': [100, 80],
 878                         'child1': [10, 40, 0, 30],
 879                         'child2': [10, 20, 0, 10],
 880                         'child3': [10, 40, 10, 30],
 881                         'child4': [10, 20, 10, 10],
 882                     },
 883                     'space-between': {
 884                         'flexbox': [100, 80],
 885                         'child1': [10, 40, 0, 40],
 886                         'child2': [10, 20, 0, 0],
 887                         'child3': [10, 40, 10, 40],
 888                         'child4': [10, 20, 10, 0],
 889                     },
 890                     'space-around': {
 891                         'flexbox': [100, 80],
 892                         'child1': [10, 40, 0, 35],
 893                         'child2': [10, 20, 0, 5],
 894                         'child3': [10, 40, 10, 35],
 895                         'child4': [10, 20, 10, 5],
 896                     },
 897                 },
 898                 'wrap-reverse': {
 899                     'flex-start': {
 900                         'flexbox': [100, 80],
 901                         'child1': [10, 40, 90, 40],
 902                         'child2': [10, 20, 90, 20],
 903                         'child3': [10, 40, 80, 40],
 904                         'child4': [10, 20, 80, 20],
 905                     },
 906                     'flex-end': {
 907                         'flexbox': [100, 80],
 908                         'child1': [10, 40, 90, 20],
 909                         'child2': [10, 20, 90, 0],
 910                         'child3': [10, 40, 80, 20],
 911                         'child4': [10, 20, 80, 0],
 912                     },
 913                     'center': {
 914                         'flexbox': [100, 80],
 915                         'child1': [10, 40, 90, 30],
 916                         'child2': [10, 20, 90, 10],
 917                         'child3': [10, 40, 80, 30],
 918                         'child4': [10, 20, 80, 10],
 919                     },
 920                     'space-between': {
 921                         'flexbox': [100, 80],
 922                         'child1': [10, 40, 90, 40],
 923                         'child2': [10, 20, 90, 0],
 924                         'child3': [10, 40, 80, 40],
 925                         'child4': [10, 20, 80, 0],
 926                     },
 927                     'space-around': {
 928                         'flexbox': [100, 80],
 929                         'child1': [10, 40, 90, 35],
 930                         'child2': [10, 20, 90, 5],
 931                         'child3': [10, 40, 80, 35],
 932                         'child4': [10, 20, 80, 5],
 933                     },
 934                 },
 935             },
 936             'rtl': {
 937                 'wrap': {
 938                     'flex-start': {
 939                         'flexbox': [100, 80],
 940                         'child1': [10, 40, 90, 40],
 941                         'child2': [10, 20, 90, 20],
 942                         'child3': [10, 40, 80, 40],
 943                         'child4': [10, 20, 80, 20],
 944                     },
 945                     'flex-end': {
 946                         'flexbox': [100, 80],
 947                         'child1': [10, 40, 90, 20],
 948                         'child2': [10, 20, 90, 0],
 949                         'child3': [10, 40, 80, 20],
 950                         'child4': [10, 20, 80, 0],
 951                     },
 952                     'center': {
 953                         'flexbox': [100, 80],
 954                         'child1': [10, 40, 90, 30],
 955                         'child2': [10, 20, 90, 10],
 956                         'child3': [10, 40, 80, 30],
 957                         'child4': [10, 20, 80, 10],
 958                     },
 959                     'space-between': {
 960                         'flexbox': [100, 80],
 961                         'child1': [10, 40, 90, 40],
 962                         'child2': [10, 20, 90, 0],
 963                         'child3': [10, 40, 80, 40],
 964                         'child4': [10, 20, 80, 0],
 965                     },
 966                     'space-around': {
 967                         'flexbox': [100, 80],
 968                         'child1': [10, 40, 90, 35],
 969                         'child2': [10, 20, 90, 5],
 970                         'child3': [10, 40, 80, 35],
 971                         'child4': [10, 20, 80, 5],
 972                     },
 973                 },
 974                 'wrap-reverse': {
 975                     'flex-start': {
 976                         'flexbox': [100, 80],
 977                         'child1': [10, 40, 0, 40],
 978                         'child2': [10, 20, 0, 20],
 979                         'child3': [10, 40, 10, 40],
 980                         'child4': [10, 20, 10, 20],
 981                     },
 982                     'flex-end': {
 983                         'flexbox': [100, 80],
 984                         'child1': [10, 40, 0, 20],
 985                         'child2': [10, 20, 0, 0],
 986                         'child3': [10, 40, 10, 20],
 987                         'child4': [10, 20, 10, 0],
 988                     },
 989                     'center': {
 990                         'flexbox': [100, 80],
 991                         'child1': [10, 40, 0, 30],
 992                         'child2': [10, 20, 0, 10],
 993                         'child3': [10, 40, 10, 30],
 994                         'child4': [10, 20, 10, 10],
 995                     },
 996                     'space-between': {
 997                         'flexbox': [100, 80],
 998                         'child1': [10, 40, 0, 40],
 999                         'child2': [10, 20, 0, 0],
1000                         'child3': [10, 40, 10, 40],
1001                         'child4': [10, 20, 10, 0],
1002                     },
1003                     'space-around': {
1004                         'flexbox': [100, 80],
1005                         'child1': [10, 40, 0, 35],
1006                         'child2': [10, 20, 0, 5],
1007                         'child3': [10, 40, 10, 35],
1008                         'child4': [10, 20, 10, 5],
1009                     },
1010                 },
1011             },
1012         },
1013         'row-reverse': {
1014             'ltr': {
1015                 'wrap': {
1016                     'flex-start': {
1017                         'flexbox': [80, 20],
1018                         'child1': [40, 10, 40, 10],
1019                         'child2': [20, 10, 20, 10],
1020                         'child3': [40, 10, 40, 0],
1021                         'child4': [20, 10, 20, 0],
1022                     },
1023                     'flex-end': {
1024                         'flexbox': [80, 20],
1025                         'child1': [40, 10, 20, 10],
1026                         'child2': [20, 10, 0, 10],
1027                         'child3': [40, 10, 20, 0],
1028                         'child4': [20, 10, 0, 0],
1029                     },
1030                     'center': {
1031                         'flexbox': [80, 20],
1032                         'child1': [40, 10, 30, 10],
1033                         'child2': [20, 10, 10, 10],
1034                         'child3': [40, 10, 30, 0],
1035                         'child4': [20, 10, 10, 0],
1036                     },
1037                     'space-between': {
1038                         'flexbox': [80, 20],
1039                         'child1': [40, 10, 40, 10],
1040                         'child2': [20, 10, 0, 10],
1041                         'child3': [40, 10, 40, 0],
1042                         'child4': [20, 10, 0, 0],
1043                     },
1044                     'space-around': {
1045                         'flexbox': [80, 20],
1046                         'child1': [40, 10, 35, 10],
1047                         'child2': [20, 10, 5, 10],
1048                         'child3': [40, 10, 35, 0],
1049                         'child4': [20, 10, 5, 0],
1050                     },
1051                 },
1052                 'wrap-reverse': {
1053                     'flex-start': {
1054                         'flexbox': [80, 20],
1055                         'child1': [40, 10, 40, 0],
1056                         'child2': [20, 10, 20, 0],
1057                         'child3': [40, 10, 40, 10],
1058                         'child4': [20, 10, 20, 10],
1059                     },
1060                     'flex-end': {
1061                         'flexbox': [80, 20],
1062                         'child1': [40, 10, 20, 0],
1063                         'child2': [20, 10, 0, 0],
1064                         'child3': [40, 10, 20, 10],
1065                         'child4': [20, 10, 0, 10],
1066                     },
1067                     'center': {
1068                         'flexbox': [80, 20],
1069                         'child1': [40, 10, 30, 0],
1070                         'child2': [20, 10, 10, 0],
1071                         'child3': [40, 10, 30, 10],
1072                         'child4': [20, 10, 10, 10],
1073                     },
1074                     'space-between': {
1075                         'flexbox': [80, 20],
1076                         'child1': [40, 10, 40, 0],
1077                         'child2': [20, 10, 0, 0],
1078                         'child3': [40, 10, 40, 10],
1079                         'child4': [20, 10, 0, 10],
1080                     },
1081                     'space-around': {
1082                         'flexbox': [80, 20],
1083                         'child1': [40, 10, 35, 0],
1084                         'child2': [20, 10, 5, 0],
1085                         'child3': [40, 10, 35, 10],
1086                         'child4': [20, 10, 5, 10],
1087                     },
1088                 },
1089             },
1090             'rtl': {
1091                 'wrap': {
1092                     'flex-start': {
1093                         'flexbox': [80, 20],
1094                         'child1': [40, 10, 0, 10],
1095                         'child2': [20, 10, 40, 10],
1096                         'child3': [40, 10, 0, 0],
1097                         'child4': [20, 10, 40, 0],
1098                     },
1099                     'flex-end': {
1100                         'flexbox': [80, 20],
1101                         'child1': [40, 10, 20, 10],
1102                         'child2': [20, 10, 60, 10],
1103                         'child3': [40, 10, 20, 0],
1104                         'child4': [20, 10, 60, 0],
1105                     },
1106                     'center': {
1107                         'flexbox': [80, 20],
1108                         'child1': [40, 10, 10, 10],
1109                         'child2': [20, 10, 50, 10],
1110                         'child3': [40, 10, 10, 0],
1111                         'child4': [20, 10, 50, 0],
1112                     },
1113                     'space-between': {
1114                         'flexbox': [80, 20],
1115                         'child1': [40, 10, 0, 10],
1116                         'child2': [20, 10, 60, 10],
1117                         'child3': [40, 10, 0, 0],
1118                         'child4': [20, 10, 60, 0],
1119                     },
1120                     'space-around': {
1121                         'flexbox': [80, 20],
1122                         'child1': [40, 10, 5, 10],
1123                         'child2': [20, 10, 55, 10],
1124                         'child3': [40, 10, 5, 0],
1125                         'child4': [20, 10, 55, 0],
1126                     },
1127                 },
1128                 'wrap-reverse': {
1129                     'flex-start': {
1130                         'flexbox': [80, 20],
1131                         'child1': [40, 10, 0, 0],
1132                         'child2': [20, 10, 40, 0],
1133                         'child3': [40, 10, 0, 10],
1134                         'child4': [20, 10, 40, 10],
1135                     },
1136                     'flex-end': {
1137                         'flexbox': [80, 20],
1138                         'child1': [40, 10, 20, 0],
1139                         'child2': [20, 10, 60, 0],
1140                         'child3': [40, 10, 20, 10],
1141                         'child4': [20, 10, 60, 10],
1142                     },
1143                     'center': {
1144                         'flexbox': [80, 20],
1145                         'child1': [40, 10, 10, 0],
1146                         'child2': [20, 10, 50, 0],
1147                         'child3': [40, 10, 10, 10],
1148                         'child4': [20, 10, 50, 10],
1149                     },
1150                     'space-between': {
1151                         'flexbox': [80, 20],
1152                         'child1': [40, 10, 0, 0],
1153                         'child2': [20, 10, 60, 0],
1154                         'child3': [40, 10, 0, 10],
1155                         'child4': [20, 10, 60, 10],
1156                     },
1157                     'space-around': {
1158                         'flexbox': [80, 20],
1159                         'child1': [40, 10, 5, 0],
1160                         'child2': [20, 10, 55, 0],
1161                         'child3': [40, 10, 5, 10],
1162                         'child4': [20, 10, 55, 10],
1163                     },
1164                 },
1165             },
1166         },
1167         'column-reverse': {
1168             'ltr': {
1169                 'wrap': {
1170                     'flex-start': {
1171                         'flexbox': [100, 80],
1172                         'child1': [10, 40, 0, 0],
1173                         'child2': [10, 20, 0, 40],
1174                         'child3': [10, 40, 10, 0],
1175                         'child4': [10, 20, 10, 40],
1176                     },
1177                     'flex-end': {
1178                         'flexbox': [100, 80],
1179                         'child1': [10, 40, 0, 20],
1180                         'child2': [10, 20, 0, 60],
1181                         'child3': [10, 40, 10, 20],
1182                         'child4': [10, 20, 10, 60],
1183                     },
1184                     'center': {
1185                         'flexbox': [100, 80],
1186                         'child1': [10, 40, 0, 10],
1187                         'child2': [10, 20, 0, 50],
1188                         'child3': [10, 40, 10, 10],
1189                         'child4': [10, 20, 10, 50],
1190                     },
1191                     'space-between': {
1192                         'flexbox': [100, 80],
1193                         'child1': [10, 40, 0, 0],
1194                         'child2': [10, 20, 0, 60],
1195                         'child3': [10, 40, 10, 0],
1196                         'child4': [10, 20, 10, 60],
1197                     },
1198                     'space-around': {
1199                         'flexbox': [100, 80],
1200                         'child1': [10, 40, 0, 5],
1201                         'child2': [10, 20, 0, 55],
1202                         'child3': [10, 40, 10, 5],
1203                         'child4': [10, 20, 10, 55],
1204                     },
1205                 },
1206                 'wrap-reverse': {
1207                     'flex-start': {
1208                         'flexbox': [100, 80],
1209                         'child1': [10, 40, 90, 0],
1210                         'child2': [10, 20, 90, 40],
1211                         'child3': [10, 40, 80, 0],
1212                         'child4': [10, 20, 80, 40],
1213                     },
1214                     'flex-end': {
1215                         'flexbox': [100, 80],
1216                         'child1': [10, 40, 90, 20],
1217                         'child2': [10, 20, 90, 60],
1218                         'child3': [10, 40, 80, 20],
1219                         'child4': [10, 20, 80, 60],
1220                     },
1221                     'center': {
1222                         'flexbox': [100, 80],
1223                         'child1': [10, 40, 90, 10],
1224                         'child2': [10, 20, 90, 50],
1225                         'child3': [10, 40, 80, 10],
1226                         'child4': [10, 20, 80, 50],
1227                     },
1228                     'space-between': {
1229                         'flexbox': [100, 80],
1230                         'child1': [10, 40, 90, 0],
1231                         'child2': [10, 20, 90, 60],
1232                         'child3': [10, 40, 80, 0],
1233                         'child4': [10, 20, 80, 60],
1234                     },
1235                     'space-around': {
1236                         'flexbox': [100, 80],
1237                         'child1': [10, 40, 90, 5],
1238                         'child2': [10, 20, 90, 55],
1239                         'child3': [10, 40, 80, 5],
1240                         'child4': [10, 20, 80, 55],
1241                     },
1242                 },
1243             },
1244             'rtl': {
1245                 'wrap': {
1246                     'flex-start': {
1247                         'flexbox': [100, 80],
1248                         'child1': [10, 40, 90, 0],
1249                         'child2': [10, 20, 90, 40],
1250                         'child3': [10, 40, 80, 0],
1251                         'child4': [10, 20, 80, 40],
1252                     },
1253                     'flex-end': {
1254                         'flexbox': [100, 80],
1255                         'child1': [10, 40, 90, 20],
1256                         'child2': [10, 20, 90, 60],
1257                         'child3': [10, 40, 80, 20],
1258                         'child4': [10, 20, 80, 60],
1259                     },
1260                     'center': {
1261                         'flexbox': [100, 80],
1262                         'child1': [10, 40, 90, 10],
1263                         'child2': [10, 20, 90, 50],
1264                         'child3': [10, 40, 80, 10],
1265                         'child4': [10, 20, 80, 50],
1266                     },
1267                     'space-between': {
1268                         'flexbox': [100, 80],
1269                         'child1': [10, 40, 90, 0],
1270                         'child2': [10, 20, 90, 60],
1271                         'child3': [10, 40, 80, 0],
1272                         'child4': [10, 20, 80, 60],
1273                     },
1274                     'space-around': {
1275                         'flexbox': [100, 80],
1276                         'child1': [10, 40, 90, 5],
1277                         'child2': [10, 20, 90, 55],
1278                         'child3': [10, 40, 80, 5],
1279                         'child4': [10, 20, 80, 55],
1280                     },
1281                 },
1282                 'wrap-reverse': {
1283                     'flex-start': {
1284                         'flexbox': [100, 80],
1285                         'child1': [10, 40, 0, 0],
1286                         'child2': [10, 20, 0, 40],
1287                         'child3': [10, 40, 10, 0],
1288                         'child4': [10, 20, 10, 40],
1289                     },
1290                     'flex-end': {
1291                         'flexbox': [100, 80],
1292                         'child1': [10, 40, 0, 20],
1293                         'child2': [10, 20, 0, 60],
1294                         'child3': [10, 40, 10, 20],
1295                         'child4': [10, 20, 10, 60],
1296                     },
1297                     'center': {
1298                         'flexbox': [100, 80],
1299                         'child1': [10, 40, 0, 10],
1300                         'child2': [10, 20, 0, 50],
1301                         'child3': [10, 40, 10, 10],
1302                         'child4': [10, 20, 10, 50],
1303                     },
1304                     'space-between': {
1305                         'flexbox': [100, 80],
1306                         'child1': [10, 40, 0, 0],
1307                         'child2': [10, 20, 0, 60],
1308                         'child3': [10, 40, 10, 0],
1309                         'child4': [10, 20, 10, 60],
1310                     },
1311                     'space-around': {
1312                         'flexbox': [100, 80],
1313                         'child1': [10, 40, 0, 5],
1314                         'child2': [10, 20, 0, 55],
1315                         'child3': [10, 40, 10, 5],
1316                         'child4': [10, 20, 10, 55],
1317                     },
1318                 },
1319             },
1320         },
1321     },
1322     'vertical-rl': {
1323         'row': {
1324             'ltr': {
1325                 'wrap': {
1326                     'flex-start': {
1327                         'flexbox': [20, 80],
1328                         'child1': [10, 40, 10, 0],
1329                         'child2': [10, 20, 10, 40],
1330                         'child3': [10, 40, 0, 0],
1331                         'child4': [10, 20, 0, 40],
1332                     },
1333                     'flex-end': {
1334                         'flexbox': [20, 80],
1335                         'child1': [10, 40, 10, 20],
1336                         'child2': [10, 20, 10, 60],
1337                         'child3': [10, 40, 0, 20],
1338                         'child4': [10, 20, 0, 60],
1339                     },
1340                     'center': {
1341                         'flexbox': [20, 80],
1342                         'child1': [10, 40, 10, 10],
1343                         'child2': [10, 20, 10, 50],
1344                         'child3': [10, 40, 0, 10],
1345                         'child4': [10, 20, 0, 50],
1346                     },
1347                     'space-between': {
1348                         'flexbox': [20, 80],
1349                         'child1': [10, 40, 10, 0],
1350                         'child2': [10, 20, 10, 60],
1351                         'child3': [10, 40, 0, 0],
1352                         'child4': [10, 20, 0, 60],
1353                     },
1354                     'space-around': {
1355                         'flexbox': [20, 80],
1356                         'child1': [10, 40, 10, 5],
1357                         'child2': [10, 20, 10, 55],
1358                         'child3': [10, 40, 0, 5],
1359                         'child4': [10, 20, 0, 55],
1360                     },
1361                 },
1362                 'wrap-reverse': {
1363                     'flex-start': {
1364                         'flexbox': [20, 80],
1365                         'child1': [10, 40, 0, 0],
1366                         'child2': [10, 20, 0, 40],
1367                         'child3': [10, 40, 10, 0],
1368                         'child4': [10, 20, 10, 40],
1369                     },
1370                     'flex-end': {
1371                         'flexbox': [20, 80],
1372                         'child1': [10, 40, 0, 20],
1373                         'child2': [10, 20, 0, 60],
1374                         'child3': [10, 40, 10, 20],
1375                         'child4': [10, 20, 10, 60],
1376                     },
1377                     'center': {
1378                         'flexbox': [20, 80],
1379                         'child1': [10, 40, 0, 10],
1380                         'child2': [10, 20, 0, 50],
1381                         'child3': [10, 40, 10, 10],
1382                         'child4': [10, 20, 10, 50],
1383                     },
1384                     'space-between': {
1385                         'flexbox': [20, 80],
1386                         'child1': [10, 40, 0, 0],
1387                         'child2': [10, 20, 0, 60],
1388                         'child3': [10, 40, 10, 0],
1389                         'child4': [10, 20, 10, 60],
1390                     },
1391                     'space-around': {
1392                         'flexbox': [20, 80],
1393                         'child1': [10, 40, 0, 5],
1394                         'child2': [10, 20, 0, 55],
1395                         'child3': [10, 40, 10, 5],
1396                         'child4': [10, 20, 10, 55],
1397                     },
1398                 },
1399             },
1400             'rtl': {
1401                 'wrap': {
1402                     'flex-start': {
1403                         'flexbox': [20, 80],
1404                         'child1': [10, 40, 10, 40],
1405                         'child2': [10, 20, 10, 20],
1406                         'child3': [10, 40, 0, 40],
1407                         'child4': [10, 20, 0, 20],
1408                     },
1409                     'flex-end': {
1410                         'flexbox': [20, 80],
1411                         'child1': [10, 40, 10, 20],
1412                         'child2': [10, 20, 10, 0],
1413                         'child3': [10, 40, 0, 20],
1414                         'child4': [10, 20, 0, 0],
1415                     },
1416                     'center': {
1417                         'flexbox': [20, 80],
1418                         'child1': [10, 40, 10, 30],
1419                         'child2': [10, 20, 10, 10],
1420                         'child3': [10, 40, 0, 30],
1421                         'child4': [10, 20, 0, 10],
1422                     },
1423                     'space-between': {
1424                         'flexbox': [20, 80],
1425                         'child1': [10, 40, 10, 40],
1426                         'child2': [10, 20, 10, 0],
1427                         'child3': [10, 40, 0, 40],
1428                         'child4': [10, 20, 0, 0],
1429                     },
1430                     'space-around': {
1431                         'flexbox': [20, 80],
1432                         'child1': [10, 40, 10, 35],
1433                         'child2': [10, 20, 10, 5],
1434                         'child3': [10, 40, 0, 35],
1435                         'child4': [10, 20, 0, 5],
1436                     },
1437                 },
1438                 'wrap-reverse': {
1439                     'flex-start': {
1440                         'flexbox': [20, 80],
1441                         'child1': [10, 40, 0, 40],
1442                         'child2': [10, 20, 0, 20],
1443                         'child3': [10, 40, 10, 40],
1444                         'child4': [10, 20, 10, 20],
1445                     },
1446                     'flex-end': {
1447                         'flexbox': [20, 80],
1448                         'child1': [10, 40, 0, 20],
1449                         'child2': [10, 20, 0, 0],
1450                         'child3': [10, 40, 10, 20],
1451                         'child4': [10, 20, 10, 0],
1452                     },
1453                     'center': {
1454                         'flexbox': [20, 80],
1455                         'child1': [10, 40, 0, 30],
1456                         'child2': [10, 20, 0, 10],
1457                         'child3': [10, 40, 10, 30],
1458                         'child4': [10, 20, 10, 10],
1459                     },
1460                     'space-between': {
1461                         'flexbox': [20, 80],
1462                         'child1': [10, 40, 0, 40],
1463                         'child2': [10, 20, 0, 0],
1464                         'child3': [10, 40, 10, 40],
1465                         'child4': [10, 20, 10, 0],
1466                     },
1467                     'space-around': {
1468                         'flexbox': [20, 80],
1469                         'child1': [10, 40, 0, 35],
1470                         'child2': [10, 20, 0, 5],
1471                         'child3': [10, 40, 10, 35],
1472                         'child4': [10, 20, 10, 5],
1473                     },
1474                 },
1475             },
1476         },
1477         'column': {
1478             'ltr': {
1479                 'wrap': {
1480                     'flex-start': {
1481                         'flexbox': [80, 10],
1482                         'child1': [40, 10, 40, 0],
1483                         'child2': [20, 10, 20, 0],
1484                         'child3': [40, 10, 40, 10],
1485                         'child4': [20, 10, 20, 10],
1486                     },
1487                     'flex-end': {
1488                         'flexbox': [80, 10],
1489                         'child1': [40, 10, 20, 0],
1490                         'child2': [20, 10, 0, 0],
1491                         'child3': [40, 10, 20, 10],
1492                         'child4': [20, 10, 0, 10],
1493                     },
1494                     'center': {
1495                         'flexbox': [80, 10],
1496                         'child1': [40, 10, 30, 0],
1497                         'child2': [20, 10, 10, 0],
1498                         'child3': [40, 10, 30, 10],
1499                         'child4': [20, 10, 10, 10],
1500                     },
1501                     'space-between': {
1502                         'flexbox': [80, 10],
1503                         'child1': [40, 10, 40, 0],
1504                         'child2': [20, 10, 0, 0],
1505                         'child3': [40, 10, 40, 10],
1506                         'child4': [20, 10, 0, 10],
1507                     },
1508                     'space-around': {
1509                         'flexbox': [80, 10],
1510                         'child1': [40, 10, 35, 0],
1511                         'child2': [20, 10, 5, 0],
1512                         'child3': [40, 10, 35, 10],
1513                         'child4': [20, 10, 5, 10],
1514                     },
1515                 },
1516                 'wrap-reverse': {
1517                     'flex-start': {
1518                         'flexbox': [80, 10],
1519                         'child1': [40, 10, 40, 0],
1520                         'child2': [20, 10, 20, 0],
1521                         'child3': [40, 10, 40, -10],
1522                         'child4': [20, 10, 20, -10],
1523                     },
1524                     'flex-end': {
1525                         'flexbox': [80, 10],
1526                         'child1': [40, 10, 20, 0],
1527                         'child2': [20, 10, 0, 0],
1528                         'child3': [40, 10, 20, -10],
1529                         'child4': [20, 10, 0, -10],
1530                     },
1531                     'center': {
1532                         'flexbox': [80, 10],
1533                         'child1': [40, 10, 30, 0],
1534                         'child2': [20, 10, 10, 0],
1535                         'child3': [40, 10, 30, -10],
1536                         'child4': [20, 10, 10, -10],
1537                     },
1538                     'space-between': {
1539                         'flexbox': [80, 10],
1540                         'child1': [40, 10, 40, 0],
1541                         'child2': [20, 10, 0, 0],
1542                         'child3': [40, 10, 40, -10],
1543                         'child4': [20, 10, 0, -10],
1544                     },
1545                     'space-around': {
1546                         'flexbox': [80, 10],
1547                         'child1': [40, 10, 35, 0],
1548                         'child2': [20, 10, 5, 0],
1549                         'child3': [40, 10, 35, -10],
1550                         'child4': [20, 10, 5, -10],
1551                     },
1552                 },
1553             },
1554             'rtl': {
1555                 'wrap': {
1556                     'flex-start': {
1557                         'flexbox': [80, 10],
1558                         'child1': [40, 10, 40, 0],
1559                         'child2': [20, 10, 20, 0],
1560                         'child3': [40, 10, 40, -10],
1561                         'child4': [20, 10, 20, -10],
1562                     },
1563                     'flex-end': {
1564                         'flexbox': [80, 10],
1565                         'child1': [40, 10, 20, 0],
1566                         'child2': [20, 10, 0, 0],
1567                         'child3': [40, 10, 20, -10],
1568                         'child4': [20, 10, 0, -10],
1569                     },
1570                     'center': {
1571                         'flexbox': [80, 10],
1572                         'child1': [40, 10, 30, 0],
1573                         'child2': [20, 10, 10, 0],
1574                         'child3': [40, 10, 30, -10],
1575                         'child4': [20, 10, 10, -10],
1576                     },
1577                     'space-between': {
1578                         'flexbox': [80, 10],
1579                         'child1': [40, 10, 40, 0],
1580                         'child2': [20, 10, 0, 0],
1581                         'child3': [40, 10, 40, -10],
1582                         'child4': [20, 10, 0, -10],
1583                     },
1584                     'space-around': {
1585                         'flexbox': [80, 10],
1586                         'child1': [40, 10, 35, 0],
1587                         'child2': [20, 10, 5, 0],
1588                         'child3': [40, 10, 35, -10],
1589                         'child4': [20, 10, 5, -10],
1590                     },
1591                 },
1592                 'wrap-reverse': {
1593                     'flex-start': {
1594                         'flexbox': [80, 10],
1595                         'child1': [40, 10, 40, 0],
1596                         'child2': [20, 10, 20, 0],
1597                         'child3': [40, 10, 40, 10],
1598                         'child4': [20, 10, 20, 10],
1599                     },
1600                     'flex-end': {
1601                         'flexbox': [80, 10],
1602                         'child1': [40, 10, 20, 0],
1603                         'child2': [20, 10, 0, 0],
1604                         'child3': [40, 10, 20, 10],
1605                         'child4': [20, 10, 0, 10],
1606                     },
1607                     'center': {
1608                         'flexbox': [80, 10],
1609                         'child1': [40, 10, 30, 0],
1610                         'child2': [20, 10, 10, 0],
1611                         'child3': [40, 10, 30, 10],
1612                         'child4': [20, 10, 10, 10],
1613                     },
1614                     'space-between': {
1615                         'flexbox': [80, 10],
1616                         'child1': [40, 10, 40, 0],
1617                         'child2': [20, 10, 0, 0],
1618                         'child3': [40, 10, 40, 10],
1619                         'child4': [20, 10, 0, 10],
1620                     },
1621                     'space-around': {
1622                         'flexbox': [80, 10],
1623                         'child1': [40, 10, 35, 0],
1624                         'child2': [20, 10, 5, 0],
1625                         'child3': [40, 10, 35, 10],
1626                         'child4': [20, 10, 5, 10],
1627                     },
1628                 },
1629             },
1630         },
1631         'row-reverse': {
1632             'ltr': {
1633                 'wrap': {
1634                     'flex-start': {
1635                         'flexbox': [20, 80],
1636                         'child1': [10, 40, 10, 40],
1637                         'child2': [10, 20, 10, 20],
1638                         'child3': [10, 40, 0, 40],
1639                         'child4': [10, 20, 0, 20],
1640                     },
1641                     'flex-end': {
1642                         'flexbox': [20, 80],
1643                         'child1': [10, 40, 10, 20],
1644                         'child2': [10, 20, 10, 0],
1645                         'child3': [10, 40, 0, 20],
1646                         'child4': [10, 20, 0, 0],
1647                     },
1648                     'center': {
1649                         'flexbox': [20, 80],
1650                         'child1': [10, 40, 10, 30],
1651                         'child2': [10, 20, 10, 10],
1652                         'child3': [10, 40, 0, 30],
1653                         'child4': [10, 20, 0, 10],
1654                     },
1655                     'space-between': {
1656                         'flexbox': [20, 80],
1657                         'child1': [10, 40, 10, 40],
1658                         'child2': [10, 20, 10, 0],
1659                         'child3': [10, 40, 0, 40],
1660                         'child4': [10, 20, 0, 0],
1661                     },
1662                     'space-around': {
1663                         'flexbox': [20, 80],
1664                         'child1': [10, 40, 10, 35],
1665                         'child2': [10, 20, 10, 5],
1666                         'child3': [10, 40, 0, 35],
1667                         'child4': [10, 20, 0, 5],
1668                     },
1669                 },
1670                 'wrap-reverse': {
1671                     'flex-start': {
1672                         'flexbox': [20, 80],
1673                         'child1': [10, 40, 0, 40],
1674                         'child2': [10, 20, 0, 20],
1675                         'child3': [10, 40, 10, 40],
1676                         'child4': [10, 20, 10, 20],
1677                     },
1678                     'flex-end': {
1679                         'flexbox': [20, 80],
1680                         'child1': [10, 40, 0, 20],
1681                         'child2': [10, 20, 0, 0],
1682                         'child3': [10, 40, 10, 20],
1683                         'child4': [10, 20, 10, 0],
1684                     },
1685                     'center': {
1686                         'flexbox': [20, 80],
1687                         'child1': [10, 40, 0, 30],
1688                         'child2': [10, 20, 0, 10],
1689                         'child3': [10, 40, 10, 30],
1690                         'child4': [10, 20, 10, 10],
1691                     },
1692                     'space-between': {
1693                         'flexbox': [20, 80],
1694                         'child1': [10, 40, 0, 40],
1695                         'child2': [10, 20, 0, 0],
1696                         'child3': [10, 40, 10, 40],
1697                         'child4': [10, 20, 10, 0],
1698                     },
1699                     'space-around': {
1700                         'flexbox': [20, 80],
1701                         'child1': [10, 40, 0, 35],
1702                         'child2': [10, 20, 0, 5],
1703                         'child3': [10, 40, 10, 35],
1704                         'child4': [10, 20, 10, 5],
1705                     },
1706                 },
1707             },
1708             'rtl': {
1709                 'wrap': {
1710                     'flex-start': {
1711                         'flexbox': [20, 80],
1712                         'child1': [10, 40, 10, 0],
1713                         'child2': [10, 20, 10, 40],
1714                         'child3': [10, 40, 0, 0],
1715                         'child4': [10, 20, 0, 40],
1716                     },
1717                     'flex-end': {
1718                         'flexbox': [20, 80],
1719                         'child1': [10, 40, 10, 20],
1720                         'child2': [10, 20, 10, 60],
1721                         'child3': [10, 40, 0, 20],
1722                         'child4': [10, 20, 0, 60],
1723                     },
1724                     'center': {
1725                         'flexbox': [20, 80],
1726                         'child1': [10, 40, 10, 10],
1727                         'child2': [10, 20, 10, 50],
1728                         'child3': [10, 40, 0, 10],
1729                         'child4': [10, 20, 0, 50],
1730                     },
1731                     'space-between': {
1732                         'flexbox': [20, 80],
1733                         'child1': [10, 40, 10, 0],
1734                         'child2': [10, 20, 10, 60],
1735                         'child3': [10, 40, 0, 0],
1736                         'child4': [10, 20, 0, 60],
1737                     },
1738                     'space-around': {
1739                         'flexbox': [20, 80],
1740                         'child1': [10, 40, 10, 5],
1741                         'child2': [10, 20, 10, 55],
1742                         'child3': [10, 40, 0, 5],
1743                         'child4': [10, 20, 0, 55],
1744                     },
1745                 },
1746                 'wrap-reverse': {
1747                     'flex-start': {
1748                         'flexbox': [20, 80],
1749                         'child1': [10, 40, 0, 0],
1750                         'child2': [10, 20, 0, 40],
1751                         'child3': [10, 40, 10, 0],
1752                         'child4': [10, 20, 10, 40],
1753                     },
1754                     'flex-end': {
1755                         'flexbox': [20, 80],
1756                         'child1': [10, 40, 0, 20],
1757                         'child2': [10, 20, 0, 60],
1758                         'child3': [10, 40, 10, 20],
1759                         'child4': [10, 20, 10, 60],
1760                     },
1761                     'center': {
1762                         'flexbox': [20, 80],
1763                         'child1': [10, 40, 0, 10],
1764                         'child2': [10, 20, 0, 50],
1765                         'child3': [10, 40, 10, 10],
1766                         'child4': [10, 20, 10, 50],
1767                     },
1768                     'space-between': {
1769                         'flexbox': [20, 80],
1770                         'child1': [10, 40, 0, 0],
1771                         'child2': [10, 20, 0, 60],
1772                         'child3': [10, 40, 10, 0],
1773                         'child4': [10, 20, 10, 60],
1774                     },
1775                     'space-around': {
1776                         'flexbox': [20, 80],
1777                         'child1': [10, 40, 0, 5],
1778                         'child2': [10, 20, 0, 55],
1779                         'child3': [10, 40, 10, 5],
1780                         'child4': [10, 20, 10, 55],
1781                     },
1782                 },
1783             },
1784         },
1785         'column-reverse': {
1786             'ltr': {
1787                 'wrap': {
1788                     'flex-start': {
1789                         'flexbox': [80, 10],
1790                         'child1': [40, 10, 0, 0],
1791                         'child2': [20, 10, 40, 0],
1792                         'child3': [40, 10, 0, 10],
1793                         'child4': [20, 10, 40, 10],
1794                     },
1795                     'flex-end': {
1796                         'flexbox': [80, 10],
1797                         'child1': [40, 10, 20, 0],
1798                         'child2': [20, 10, 60, 0],
1799                         'child3': [40, 10, 20, 10],
1800                         'child4': [20, 10, 60, 10],
1801                     },
1802                     'center': {
1803                         'flexbox': [80, 10],
1804                         'child1': [40, 10, 10, 0],
1805                         'child2': [20, 10, 50, 0],
1806                         'child3': [40, 10, 10, 10],
1807                         'child4': [20, 10, 50, 10],
1808                     },
1809                     'space-between': {
1810                         'flexbox': [80, 10],
1811                         'child1': [40, 10, 0, 0],
1812                         'child2': [20, 10, 60, 0],
1813                         'child3': [40, 10, 0, 10],
1814                         'child4': [20, 10, 60, 10],
1815                     },
1816                     'space-around': {
1817                         'flexbox': [80, 10],
1818                         'child1': [40, 10, 5, 0],
1819                         'child2': [20, 10, 55, 0],
1820                         'child3': [40, 10, 5, 10],
1821                         'child4': [20, 10, 55, 10],
1822                     },
1823                 },
1824                 'wrap-reverse': {
1825                     'flex-start': {
1826                         'flexbox': [80, 10],
1827                         'child1': [40, 10, 0, 0],
1828                         'child2': [20, 10, 40, 0],
1829                         'child3': [40, 10, 0, -10],
1830                         'child4': [20, 10, 40, -10],
1831                     },
1832                     'flex-end': {
1833                         'flexbox': [80, 10],
1834                         'child1': [40, 10, 20, 0],
1835                         'child2': [20, 10, 60, 0],
1836                         'child3': [40, 10, 20, -10],
1837                         'child4': [20, 10, 60, -10],
1838                     },
1839                     'center': {
1840                         'flexbox': [80, 10],
1841                         'child1': [40, 10, 10, 0],
1842                         'child2': [20, 10, 50, 0],
1843                         'child3': [40, 10, 10, -10],
1844                         'child4': [20, 10, 50, -10],
1845                     },
1846                     'space-between': {
1847                         'flexbox': [80, 10],
1848                         'child1': [40, 10, 0, 0],
1849                         'child2': [20, 10, 60, 0],
1850                         'child3': [40, 10, 0, -10],
1851                         'child4': [20, 10, 60, -10],
1852                     },
1853                     'space-around': {
1854                         'flexbox': [80, 10],
1855                         'child1': [40, 10, 5, 0],
1856                         'child2': [20, 10, 55, 0],
1857                         'child3': [40, 10, 5, -10],
1858                         'child4': [20, 10, 55, -10],
1859                     },
1860                 },
1861             },
1862             'rtl': {
1863                 'wrap': {
1864                     'flex-start': {
1865                         'flexbox': [80, 10],
1866                         'child1': [40, 10, 0, 0],
1867                         'child2': [20, 10, 40, 0],
1868                         'child3': [40, 10, 0, -10],
1869                         'child4': [20, 10, 40, -10],
1870                     },
1871                     'flex-end': {
1872                         'flexbox': [80, 10],
1873                         'child1': [40, 10, 20, 0],
1874                         'child2': [20, 10, 60, 0],
1875                         'child3': [40, 10, 20, -10],
1876                         'child4': [20, 10, 60, -10],
1877                     },
1878                     'center': {
1879                         'flexbox': [80, 10],
1880                         'child1': [40, 10, 10, 0],
1881                         'child2': [20, 10, 50, 0],
1882                         'child3': [40, 10, 10, -10],
1883                         'child4': [20, 10, 50, -10],
1884                     },
1885                     'space-between': {
1886                         'flexbox': [80, 10],
1887                         'child1': [40, 10, 0, 0],
1888                         'child2': [20, 10, 60, 0],
1889                         'child3': [40, 10, 0, -10],
1890                         'child4': [20, 10, 60, -10],
1891                     },
1892                     'space-around': {
1893                         'flexbox': [80, 10],
1894                         'child1': [40, 10, 5, 0],
1895                         'child2': [20, 10, 55, 0],
1896                         'child3': [40, 10, 5, -10],
1897                         'child4': [20, 10, 55, -10],
1898                     },
1899                 },
1900                 'wrap-reverse': {
1901                     'flex-start': {
1902                         'flexbox': [80, 10],
1903                         'child1': [40, 10, 0, 0],
1904                         'child2': [20, 10, 40, 0],
1905                         'child3': [40, 10, 0, 10],
1906                         'child4': [20, 10, 40, 10],
1907                     },
1908                     'flex-end': {
1909                         'flexbox': [80, 10],
1910                         'child1': [40, 10, 20, 0],
1911                         'child2': [20, 10, 60, 0],
1912                         'child3': [40, 10, 20, 10],
1913                         'child4': [20, 10, 60, 10],
1914                     },
1915                     'center': {
1916                         'flexbox': [80, 10],
1917                         'child1': [40, 10, 10, 0],
1918                         'child2': [20, 10, 50, 0],
1919                         'child3': [40, 10, 10, 10],
1920                         'child4': [20, 10, 50, 10],
1921                     },
1922                     'space-between': {
1923                         'flexbox': [80, 10],
1924                         'child1': [40, 10, 0, 0],
1925                         'child2': [20, 10, 60, 0],
1926                         'child3': [40, 10, 0, 10],
1927                         'child4': [20, 10, 60, 10],
1928                     },
1929                     'space-around': {
1930                         'flexbox': [80, 10],
1931                         'child1': [40, 10, 5, 0],
1932                         'child2': [20, 10, 55, 0],
1933                         'child3': [40, 10, 5, 10],
1934                         'child4': [20, 10, 55, 10],
1935                     },
1936                 },
1937             },
1938         },
1939     },
1940     'vertical-lr': {
1941         'row': {
1942             'ltr': {
1943                 'wrap': {
1944                     'flex-start': {
1945                         'flexbox': [20, 80],
1946                         'child1': [10, 40, 0, 0],
1947                         'child2': [10, 20, 0, 40],
1948                         'child3': [10, 40, 10, 0],
1949                         'child4': [10, 20, 10, 40],
1950                     },
1951                     'flex-end': {
1952                         'flexbox': [20, 80],
1953                         'child1': [10, 40, 0, 20],
1954                         'child2': [10, 20, 0, 60],
1955                         'child3': [10, 40, 10, 20],
1956                         'child4': [10, 20, 10, 60],
1957                     },
1958                     'center': {
1959                         'flexbox': [20, 80],
1960                         'child1': [10, 40, 0, 10],
1961                         'child2': [10, 20, 0, 50],
1962                         'child3': [10, 40, 10, 10],
1963                         'child4': [10, 20, 10, 50],
1964                     },
1965                     'space-between': {
1966                         'flexbox': [20, 80],
1967                         'child1': [10, 40, 0, 0],
1968                         'child2': [10, 20, 0, 60],
1969                         'child3': [10, 40, 10, 0],
1970                         'child4': [10, 20, 10, 60],
1971                     },
1972                     'space-around': {
1973                         'flexbox': [20, 80],
1974                         'child1': [10, 40, 0, 5],
1975                         'child2': [10, 20, 0, 55],
1976                         'child3': [10, 40, 10, 5],
1977                         'child4': [10, 20, 10, 55],
1978                     },
1979                 },
1980                 'wrap-reverse': {
1981                     'flex-start': {
1982                         'flexbox': [20, 80],
1983                         'child1': [10, 40, 10, 0],
1984                         'child2': [10, 20, 10, 40],
1985                         'child3': [10, 40, 0, 0],
1986                         'child4': [10, 20, 0, 40],
1987                     },
1988                     'flex-end': {
1989                         'flexbox': [20, 80],
1990                         'child1': [10, 40, 10, 20],
1991                         'child2': [10, 20, 10, 60],
1992                         'child3': [10, 40, 0, 20],
1993                         'child4': [10, 20, 0, 60],
1994                     },
1995                     'center': {
1996                         'flexbox': [20, 80],
1997                         'child1': [10, 40, 10, 10],
1998                         'child2': [10, 20, 10, 50],
1999                         'child3': [10, 40, 0, 10],
2000                         'child4': [10, 20, 0, 50],
2001                     },
2002                     'space-between': {
2003                         'flexbox': [20, 80],
2004                         'child1': [10, 40, 10, 0],
2005                         'child2': [10, 20, 10, 60],
2006                         'child3': [10, 40, 0, 0],
2007                         'child4': [10, 20, 0, 60],
2008                     },
2009                     'space-around': {
2010                         'flexbox': [20, 80],
2011                         'child1': [10, 40, 10, 5],
2012                         'child2': [10, 20, 10, 55],
2013                         'child3': [10, 40, 0, 5],
2014                         'child4': [10, 20, 0, 55],
2015                     },
2016                 },
2017             },
2018             'rtl': {
2019                 'wrap': {
2020                     'flex-start': {
2021                         'flexbox': [20, 80],
2022                         'child1': [10, 40, 0, 40],
2023                         'child2': [10, 20, 0, 20],
2024                         'child3': [10, 40, 10, 40],
2025                         'child4': [10, 20, 10, 20],
2026                     },
2027                     'flex-end': {
2028                         'flexbox': [20, 80],
2029                         'child1': [10, 40, 0, 20],
2030                         'child2': [10, 20, 0, 0],
2031                         'child3': [10, 40, 10, 20],
2032                         'child4': [10, 20, 10, 0],
2033                     },
2034                     'center': {
2035                         'flexbox': [20, 80],
2036                         'child1': [10, 40, 0, 30],
2037                         'child2': [10, 20, 0, 10],
2038                         'child3': [10, 40, 10, 30],
2039                         'child4': [10, 20, 10, 10],
2040                     },
2041                     'space-between': {
2042                         'flexbox': [20, 80],
2043                         'child1': [10, 40, 0, 40],
2044                         'child2': [10, 20, 0, 0],
2045                         'child3': [10, 40, 10, 40],
2046                         'child4': [10, 20, 10, 0],
2047                     },
2048                     'space-around': {
2049                         'flexbox': [20, 80],
2050                         'child1': [10, 40, 0, 35],
2051                         'child2': [10, 20, 0, 5],
2052                         'child3': [10, 40, 10, 35],
2053                         'child4': [10, 20, 10, 5],
2054                     },
2055                 },
2056                 'wrap-reverse': {
2057                     'flex-start': {
2058                         'flexbox': [20, 80],
2059                         'child1': [10, 40, 10, 40],
2060                         'child2': [10, 20, 10, 20],
2061                         'child3': [10, 40, 0, 40],
2062                         'child4': [10, 20, 0, 20],
2063                     },
2064                     'flex-end': {
2065                         'flexbox': [20, 80],
2066                         'child1': [10, 40, 10, 20],
2067                         'child2': [10, 20, 10, 0],
2068                         'child3': [10, 40, 0, 20],
2069                         'child4': [10, 20, 0, 0],
2070                     },
2071                     'center': {
2072                         'flexbox': [20, 80],
2073                         'child1': [10, 40, 10, 30],
2074                         'child2': [10, 20, 10, 10],
2075                         'child3': [10, 40, 0, 30],
2076                         'child4': [10, 20, 0, 10],
2077                     },
2078                     'space-between': {
2079                         'flexbox': [20, 80],
2080                         'child1': [10, 40, 10, 40],
2081                         'child2': [10, 20, 10, 0],
2082                         'child3': [10, 40, 0, 40],
2083                         'child4': [10, 20, 0, 0],
2084                     },
2085                     'space-around': {
2086                         'flexbox': [20, 80],
2087                         'child1': [10, 40, 10, 35],
2088                         'child2': [10, 20, 10, 5],
2089                         'child3': [10, 40, 0, 35],
2090                         'child4': [10, 20, 0, 5],
2091                     },
2092                 },
2093             },
2094         },
2095         'column': {
2096             'ltr': {
2097                 'wrap': {
2098                     'flex-start': {
2099                         'flexbox': [80, 10],
2100                         'child1': [40, 10, 0, 0],
2101                         'child2': [20, 10, 40, 0],
2102                         'child3': [40, 10, 0, 10],
2103                         'child4': [20, 10, 40, 10],
2104                     },
2105                     'flex-end': {
2106                         'flexbox': [80, 10],
2107                         'child1': [40, 10, 20, 0],
2108                         'child2': [20, 10, 60, 0],
2109                         'child3': [40, 10, 20, 10],
2110                         'child4': [20, 10, 60, 10],
2111                     },
2112                     'center': {
2113                         'flexbox': [80, 10],
2114                         'child1': [40, 10, 10, 0],
2115                         'child2': [20, 10, 50, 0],
2116                         'child3': [40, 10, 10, 10],
2117                         'child4': [20, 10, 50, 10],
2118                     },
2119                     'space-between': {
2120                         'flexbox': [80, 10],
2121                         'child1': [40, 10, 0, 0],
2122                         'child2': [20, 10, 60, 0],
2123                         'child3': [40, 10, 0, 10],
2124                         'child4': [20, 10, 60, 10],
2125                     },
2126                     'space-around': {
2127                         'flexbox': [80, 10],
2128                         'child1': [40, 10, 5, 0],
2129                         'child2': [20, 10, 55, 0],
2130                         'child3': [40, 10, 5, 10],
2131                         'child4': [20, 10, 55, 10],
2132                     },
2133                 },
2134                 'wrap-reverse': {
2135                     'flex-start': {
2136                         'flexbox': [80, 10],
2137                         'child1': [40, 10, 0, 0],
2138                         'child2': [20, 10, 40, 0],
2139                         'child3': [40, 10, 0, -10],
2140                         'child4': [20, 10, 40, -10],
2141                     },
2142                     'flex-end': {
2143                         'flexbox': [80, 10],
2144                         'child1': [40, 10, 20, 0],
2145                         'child2': [20, 10, 60, 0],
2146                         'child3': [40, 10, 20, -10],
2147                         'child4': [20, 10, 60, -10],
2148                     },
2149                     'center': {
2150                         'flexbox': [80, 10],
2151                         'child1': [40, 10, 10, 0],
2152                         'child2': [20, 10, 50, 0],
2153                         'child3': [40, 10, 10, -10],
2154                         'child4': [20, 10, 50, -10],
2155                     },
2156                     'space-between': {
2157                         'flexbox': [80, 10],
2158                         'child1': [40, 10, 0, 0],
2159                         'child2': [20, 10, 60, 0],
2160                         'child3': [40, 10, 0, -10],
2161                         'child4': [20, 10, 60, -10],
2162                     },
2163                     'space-around': {
2164                         'flexbox': [80, 10],
2165                         'child1': [40, 10, 5, 0],
2166                         'child2': [20, 10, 55, 0],
2167                         'child3': [40, 10, 5, -10],
2168                         'child4': [20, 10, 55, -10],
2169                     },
2170                 },
2171             },
2172             'rtl': {
2173                 'wrap': {
2174                     'flex-start': {
2175                         'flexbox': [80, 10],
2176                         'child1': [40, 10, 0, 0],
2177                         'child2': [20, 10, 40, 0],
2178                         'child3': [40, 10, 0, -10],
2179                         'child4': [20, 10, 40, -10],
2180                     },
2181                     'flex-end': {
2182                         'flexbox': [80, 10],
2183                         'child1': [40, 10, 20, 0],
2184                         'child2': [20, 10, 60, 0],
2185                         'child3': [40, 10, 20, -10],
2186                         'child4': [20, 10, 60, -10],
2187                     },
2188                     'center': {
2189                         'flexbox': [80, 10],
2190                         'child1': [40, 10, 10, 0],
2191                         'child2': [20, 10, 50, 0],
2192                         'child3': [40, 10, 10, -10],
2193                         'child4': [20, 10, 50, -10],
2194                     },
2195                     'space-between': {
2196                         'flexbox': [80, 10],
2197                         'child1': [40, 10, 0, 0],
2198                         'child2': [20, 10, 60, 0],
2199                         'child3': [40, 10, 0, -10],
2200                         'child4': [20, 10, 60, -10],
2201                     },
2202                     'space-around': {
2203                         'flexbox': [80, 10],
2204                         'child1': [40, 10, 5, 0],
2205                         'child2': [20, 10, 55, 0],
2206                         'child3': [40, 10, 5, -10],
2207                         'child4': [20, 10, 55, -10],
2208                     },
2209                 },
2210                 'wrap-reverse': {
2211                     'flex-start': {
2212                         'flexbox': [80, 10],
2213                         'child1': [40, 10, 0, 0],
2214                         'child2': [20, 10, 40, 0],
2215                         'child3': [40, 10, 0, 10],
2216                         'child4': [20, 10, 40, 10],
2217                     },
2218                     'flex-end': {
2219                         'flexbox': [80, 10],
2220                         'child1': [40, 10, 20, 0],
2221                         'child2': [20, 10, 60, 0],
2222                         'child3': [40, 10, 20, 10],
2223                         'child4': [20, 10, 60, 10],
2224                     },
2225                     'center': {
2226                         'flexbox': [80, 10],
2227                         'child1': [40, 10, 10, 0],
2228                         'child2': [20, 10, 50, 0],
2229                         'child3': [40, 10, 10, 10],
2230                         'child4': [20, 10, 50, 10],
2231                     },
2232                     'space-between': {
2233                         'flexbox': [80, 10],
2234                         'child1': [40, 10, 0, 0],
2235                         'child2': [20, 10, 60, 0],
2236                         'child3': [40, 10, 0, 10],
2237                         'child4': [20, 10, 60, 10],
2238                     },
2239                     'space-around': {
2240                         'flexbox': [80, 10],
2241                         'child1': [40, 10, 5, 0],
2242                         'child2': [20, 10, 55, 0],
2243                         'child3': [40, 10, 5, 10],
2244                         'child4': [20, 10, 55, 10],
2245                     },
2246                 },
2247             },
2248         },
2249         'row-reverse': {
2250             'ltr': {
2251                 'wrap': {
2252                     'flex-start': {
2253                         'flexbox': [20, 80],
2254                         'child1': [10, 40, 0, 40],
2255                         'child2': [10, 20, 0, 20],
2256                         'child3': [10, 40, 10, 40],
2257                         'child4': [10, 20, 10, 20],
2258                     },
2259                     'flex-end': {
2260                         'flexbox': [20, 80],
2261                         'child1': [10, 40, 0, 20],
2262                         'child2': [10, 20, 0, 0],
2263                         'child3': [10, 40, 10, 20],
2264                         'child4': [10, 20, 10, 0],
2265                     },
2266                     'center': {
2267                         'flexbox': [20, 80],
2268                         'child1': [10, 40, 0, 30],
2269                         'child2': [10, 20, 0, 10],
2270                         'child3': [10, 40, 10, 30],
2271                         'child4': [10, 20, 10, 10],
2272                     },
2273                     'space-between': {
2274                         'flexbox': [20, 80],
2275                         'child1': [10, 40, 0, 40],
2276                         'child2': [10, 20, 0, 0],
2277                         'child3': [10, 40, 10, 40],
2278                         'child4': [10, 20, 10, 0],
2279                     },
2280                     'space-around': {
2281                         'flexbox': [20, 80],
2282                         'child1': [10, 40, 0, 35],
2283                         'child2': [10, 20, 0, 5],
2284                         'child3': [10, 40, 10, 35],
2285                         'child4': [10, 20, 10, 5],
2286                     },
2287                 },
2288                 'wrap-reverse': {
2289                     'flex-start': {
2290                         'flexbox': [20, 80],
2291                         'child1': [10, 40, 10, 40],
2292                         'child2': [10, 20, 10, 20],
2293                         'child3': [10, 40, 0, 40],
2294                         'child4': [10, 20, 0, 20],
2295                     },
2296                     'flex-end': {
2297                         'flexbox': [20, 80],
2298                         'child1': [10, 40, 10, 20],
2299                         'child2': [10, 20, 10, 0],
2300                         'child3': [10, 40, 0, 20],
2301                         'child4': [10, 20, 0, 0],
2302                     },
2303                     'center': {
2304                         'flexbox': [20, 80],
2305                         'child1': [10, 40, 10, 30],
2306                         'child2': [10, 20, 10, 10],
2307                         'child3': [10, 40, 0, 30],
2308                         'child4': [10, 20, 0, 10],
2309                     },
2310                     'space-between': {
2311                         'flexbox': [20, 80],
2312                         'child1': [10, 40, 10, 40],
2313                         'child2': [10, 20, 10, 0],
2314                         'child3': [10, 40, 0, 40],
2315                         'child4': [10, 20, 0, 0],
2316                     },
2317                     'space-around': {
2318                         'flexbox': [20, 80],
2319                         'child1': [10, 40, 10, 35],
2320                         'child2': [10, 20, 10, 5],
2321                         'child3': [10, 40, 0, 35],
2322                         'child4': [10, 20, 0, 5],
2323                     },
2324                 },
2325             },
2326             'rtl': {
2327                 'wrap': {
2328                     'flex-start': {
2329                         'flexbox': [20, 80],
2330                         'child1': [10, 40, 0, 0],
2331                         'child2': [10, 20, 0, 40],
2332                         'child3': [10, 40, 10, 0],
2333                         'child4': [10, 20, 10, 40],
2334                     },
2335                     'flex-end': {
2336                         'flexbox': [20, 80],
2337                         'child1': [10, 40, 0, 20],
2338                         'child2': [10, 20, 0, 60],
2339                         'child3': [10, 40, 10, 20],
2340                         'child4': [10, 20, 10, 60],
2341                     },
2342                     'center': {
2343                         'flexbox': [20, 80],
2344                         'child1': [10, 40, 0, 10],
2345                         'child2': [10, 20, 0, 50],
2346                         'child3': [10, 40, 10, 10],
2347                         'child4': [10, 20, 10, 50],
2348                     },
2349                     'space-between': {
2350                         'flexbox': [20, 80],
2351                         'child1': [10, 40, 0, 0],
2352                         'child2': [10, 20, 0, 60],
2353                         'child3': [10, 40, 10, 0],
2354                         'child4': [10, 20, 10, 60],
2355                     },
2356                     'space-around': {
2357                         'flexbox': [20, 80],
2358                         'child1': [10, 40, 0, 5],
2359                         'child2': [10, 20, 0, 55],
2360                         'child3': [10, 40, 10, 5],
2361                         'child4': [10, 20, 10, 55],
2362                     },
2363                 },
2364                 'wrap-reverse': {
2365                     'flex-start': {
2366                         'flexbox': [20, 80],
2367                         'child1': [10, 40, 10, 0],
2368                         'child2': [10, 20, 10, 40],
2369                         'child3': [10, 40, 0, 0],
2370                         'child4': [10, 20, 0, 40],
2371                     },
2372                     'flex-end': {
2373                         'flexbox': [20, 80],
2374                         'child1': [10, 40, 10, 20],
2375                         'child2': [10, 20, 10, 60],
2376                         'child3': [10, 40, 0, 20],
2377                         'child4': [10, 20, 0, 60],
2378                     },
2379                     'center': {
2380                         'flexbox': [20, 80],
2381                         'child1': [10, 40, 10, 10],
2382                         'child2': [10, 20, 10, 50],
2383                         'child3': [10, 40, 0, 10],
2384                         'child4': [10, 20, 0, 50],
2385                     },
2386                     'space-between': {
2387                         'flexbox': [20, 80],
2388                         'child1': [10, 40, 10, 0],
2389                         'child2': [10, 20, 10, 60],
2390                         'child3': [10, 40, 0, 0],
2391                         'child4': [10, 20, 0, 60],
2392                     },
2393                     'space-around': {
2394                         'flexbox': [20, 80],
2395                         'child1': [10, 40, 10, 5],
2396                         'child2': [10, 20, 10, 55],
2397                         'child3': [10, 40, 0, 5],
2398                         'child4': [10, 20, 0, 55],
2399                     },
2400                 },
2401             },
2402         },
2403         'column-reverse': {
2404             'ltr': {
2405                 'wrap': {
2406                     'flex-start': {
2407                         'flexbox': [80, 10],
2408                         'child1': [40, 10, 40, 0],
2409                         'child2': [20, 10, 20, 0],
2410                         'child3': [40, 10, 40, 10],
2411                         'child4': [20, 10, 20, 10],
2412                     },
2413                     'flex-end': {
2414                         'flexbox': [80, 10],
2415                         'child1': [40, 10, 20, 0],
2416                         'child2': [20, 10, 0, 0],
2417                         'child3': [40, 10, 20, 10],
2418                         'child4': [20, 10, 0, 10],
2419                     },
2420                     'center': {
2421                         'flexbox': [80, 10],
2422                         'child1': [40, 10, 30, 0],
2423                         'child2': [20, 10, 10, 0],
2424                         'child3': [40, 10, 30, 10],
2425                         'child4': [20, 10, 10, 10],
2426                     },
2427                     'space-between': {
2428                         'flexbox': [80, 10],
2429                         'child1': [40, 10, 40, 0],
2430                         'child2': [20, 10, 0, 0],
2431                         'child3': [40, 10, 40, 10],
2432                         'child4': [20, 10, 0, 10],
2433                     },
2434                     'space-around': {
2435                         'flexbox': [80, 10],
2436                         'child1': [40, 10, 35, 0],
2437                         'child2': [20, 10, 5, 0],
2438                         'child3': [40, 10, 35, 10],
2439                         'child4': [20, 10, 5, 10],
2440                     },
2441                 },
2442                 'wrap-reverse': {
2443                     'flex-start': {
2444                         'flexbox': [80, 10],
2445                         'child1': [40, 10, 40, 0],
2446                         'child2': [20, 10, 20, 0],
2447                         'child3': [40, 10, 40, -10],
2448                         'child4': [20, 10, 20, -10],
2449                     },
2450                     'flex-end': {
2451                         'flexbox': [80, 10],
2452                         'child1': [40, 10, 20, 0],
2453                         'child2': [20, 10, 0, 0],
2454                         'child3': [40, 10, 20, -10],
2455                         'child4': [20, 10, 0, -10],
2456                     },
2457                     'center': {
2458                         'flexbox': [80, 10],
2459                         'child1': [40, 10, 30, 0],
2460                         'child2': [20, 10, 10, 0],
2461                         'child3': [40, 10, 30, -10],
2462                         'child4': [20, 10, 10, -10],
2463                     },
2464                     'space-between': {
2465                         'flexbox': [80, 10],
2466                         'child1': [40, 10, 40, 0],
2467                         'child2': [20, 10, 0, 0],
2468                         'child3': [40, 10, 40, -10],
2469                         'child4': [20, 10, 0, -10],
2470                     },
2471                     'space-around': {
2472                         'flexbox': [80, 10],
2473                         'child1': [40, 10, 35, 0],
2474                         'child2': [20, 10, 5, 0],
2475                         'child3': [40, 10, 35, -10],
2476                         'child4': [20, 10, 5, -10],
2477                     },
2478                 },
2479             },
2480             'rtl': {
2481                 'wrap': {
2482                     'flex-start': {
2483                         'flexbox': [80, 10],
2484                         'child1': [40, 10, 40, 0],
2485                         'child2': [20, 10, 20, 0],
2486                         'child3': [40, 10, 40, -10],
2487                         'child4': [20, 10, 20, -10],
2488                     },
2489                     'flex-end': {
2490                         'flexbox': [80, 10],
2491                         'child1': [40, 10, 20, 0],
2492                         'child2': [20, 10, 0, 0],
2493                         'child3': [40, 10, 20, -10],
2494                         'child4': [20, 10, 0, -10],
2495                     },
2496                     'center': {
2497                         'flexbox': [80, 10],
2498                         'child1': [40, 10, 30, 0],
2499                         'child2': [20, 10, 10, 0],
2500                         'child3': [40, 10, 30, -10],
2501                         'child4': [20, 10, 10, -10],
2502                     },
2503                     'space-between': {
2504                         'flexbox': [80, 10],
2505                         'child1': [40, 10, 40, 0],
2506                         'child2': [20, 10, 0, 0],
2507                         'child3': [40, 10, 40, -10],
2508                         'child4': [20, 10, 0, -10],
2509                     },
2510                     'space-around': {
2511                         'flexbox': [80, 10],
2512                         'child1': [40, 10, 35, 0],
2513                         'child2': [20, 10, 5, 0],
2514                         'child3': [40, 10, 35, -10],
2515                         'child4': [20, 10, 5, -10],
2516                     },
2517                 },
2518                 'wrap-reverse': {
2519                     'flex-start': {
2520                         'flexbox': [80, 10],
2521                         'child1': [40, 10, 40, 0],
2522                         'child2': [20, 10, 20, 0],
2523                         'child3': [40, 10, 40, 10],
2524                         'child4': [20, 10, 20, 10],
2525                     },
2526                     'flex-end': {
2527                         'flexbox': [80, 10],
2528                         'child1': [40, 10, 20, 0],
2529                         'child2': [20, 10, 0, 0],
2530                         'child3': [40, 10, 20, 10],
2531                         'child4': [20, 10, 0, 10],
2532                     },
2533                     'center': {
2534                         'flexbox': [80, 10],
2535                         'child1': [40, 10, 30, 0],
2536                         'child2': [20, 10, 10, 0],
2537                         'child3': [40, 10, 30, 10],
2538                         'child4': [20, 10, 10, 10],
2539                     },
2540                     'space-between': {
2541                         'flexbox': [80, 10],
2542                         'child1': [40, 10, 40, 0],
2543                         'child2': [20, 10, 0, 0],
2544                         'child3': [40, 10, 40, 10],
2545                         'child4': [20, 10, 0, 10],
2546                     },
2547                     'space-around': {
2548                         'flexbox': [80, 10],
2549                         'child1': [40, 10, 35, 0],
2550                         'child2': [20, 10, 5, 0],
2551                         'child3': [40, 10, 35, 10],
2552                         'child4': [20, 10, 5, 10],
2553                     },
2554                 },
2555             },
2556         },
2557     },
2558 };
2559
2560 function mainAxisDirection(writingMode, flexDirection)
2561 {
2562     if ((writingMode.indexOf('horizontal') != -1 && flexDirection.indexOf('row') != -1)
2563         || (writingMode.indexOf('vertical') != -1 && flexDirection.indexOf('column') != -1))
2564         return 'width';
2565     return 'height';
2566 }
2567
2568 function addChild(flexbox, mainAxis, crossAxis, preferredSize, crossAxisLength, expectations)
2569 {
2570     var child = document.createElement('div');
2571     child.setAttribute('style', mainAxis + ': ' + preferredSize + 'px;'
2572         + crossAxis + ': ' + crossAxisLength + 'px;');
2573
2574     child.setAttribute("data-expected-width", expectations[0]);
2575     child.setAttribute("data-expected-height", expectations[1]);
2576     child.setAttribute("data-offset-x", expectations[2]);
2577     child.setAttribute("data-offset-y", expectations[3]);
2578
2579     flexbox.appendChild(child);
2580 }
2581
2582 var writingModes = ['horizontal-tb', 'horizontal-bt', 'vertical-rl', 'vertical-lr'];
2583 var flexDirections = ['row', 'column', 'row-reverse', 'column-reverse'];
2584 var directions = ['ltr', 'rtl'];
2585 var wraps = ['wrap', 'wrap-reverse'];
2586 var justifyContents = ['flex-start', 'flex-end', 'center', 'space-between', 'space-around'];
2587
2588 writingModes.forEach(function(writingMode) {
2589     flexDirections.forEach(function(flexDirection) {
2590         directions.forEach(function(direction) {
2591             wraps.forEach(function(wrap) {
2592                 justifyContents.forEach(function(justifyContent) {
2593                     var flexboxClassName = writingMode + ' ' + direction + ' ' + flexDirection + ' ' + wrap + ' justify-content-' + justifyContent;
2594                     var title = document.createElement('div');
2595                     title.className = 'title';
2596                     title.innerHTML = flexboxClassName;
2597                     document.body.appendChild(title);
2598
2599                     var mainAxis = mainAxisDirection(writingMode, flexDirection);
2600                     var crossAxis = (mainAxis == 'width') ? 'height' : 'width';
2601
2602                     var flexbox = document.createElement('div');
2603                     flexbox.className = 'flexbox ' + flexboxClassName;
2604                     flexbox.setAttribute('style', mainAxis + ': 80px');
2605
2606                     var baselineMargin = (flexDirection.indexOf('row') != -1) ? '-webkit-margin-before: 5px' : '-webkit-margin-start: 5px';
2607
2608                     var testExpectations = expectations[writingMode][flexDirection][direction][wrap][justifyContent];
2609                     addChild(flexbox, mainAxis, crossAxis, 40, '10', testExpectations['child1']);
2610                     addChild(flexbox, mainAxis, crossAxis, 20, '10', testExpectations['child2']);
2611                     addChild(flexbox, mainAxis, crossAxis, 40, '10', testExpectations['child3']);
2612                     addChild(flexbox, mainAxis, crossAxis, 20, '10', testExpectations['child4']);
2613
2614                     flexbox.setAttribute("data-expected-width", testExpectations.flexbox[0]);
2615                     flexbox.setAttribute("data-expected-height", testExpectations.flexbox[1]);
2616
2617                     document.body.appendChild(flexbox);
2618                 })
2619             })
2620         })
2621     })
2622 })
2623 </script>
2624 </body>
2625 </html>