1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000 1.2 +++ b/layout/reftests/w3c-css/submitted/flexbox/flexbox-baseline-multi-item-horiz-1.html Wed Dec 31 06:09:35 2014 +0100 1.3 @@ -0,0 +1,47 @@ 1.4 +<!DOCTYPE html> 1.5 +<!-- 1.6 + Any copyright is dedicated to the Public Domain. 1.7 + http://creativecommons.org/publicdomain/zero/1.0/ 1.8 +--> 1.9 +<!-- Testcase for how we compute the baseline of a horizontal flex container 1.10 + with several flex items, none of which have "align-self:baseline". The 1.11 + spec says this about this case: 1.12 + ...if the flex container has at least one flex item, and its 1.13 + first flex item has a baseline parallel to the flex 1.14 + container's main axis, the flex container's main-axis 1.15 + baseline is that baseline. 1.16 +--> 1.17 +<html> 1.18 +<head> 1.19 + <title>CSS Test: Testing the baseline of a horizontal flex container whose flex items are not baseline-aligned</title> 1.20 + <link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com"> 1.21 + <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-baselines"> 1.22 + <link rel="match" href="flexbox-baseline-multi-item-horiz-1-ref.html"> 1.23 + <meta charset="utf-8"> 1.24 + <style> 1.25 + .flexContainer { 1.26 + display: inline-flex; 1.27 + background: lightblue; 1.28 + } 1.29 + .smallFont { 1.30 + font-size: 10px; 1.31 + line-height: 10px; 1.32 + } 1.33 + .bigFont { 1.34 + font-size: 20px; 1.35 + line-height: 20px; 1.36 + } 1.37 + </style> 1.38 +</head> 1.39 +<body> 1.40 + a 1.41 + <div class="flexContainer"> 1.42 + <div class="smallFont">b</div 1.43 + ><div class="bigFont">c</div> 1.44 + </div> 1.45 + <div class="flexContainer"> 1.46 + <div class="bigFont">d</div 1.47 + ><div class="smallFont">e</div> 1.48 + </div> 1.49 +</body> 1.50 +</html>