Index: LayoutTests/css3/flexbox/aspect-ratios-main-size-calculation.html |
diff --git a/LayoutTests/css3/flexbox/aspect-ratios-main-size-calculation.html b/LayoutTests/css3/flexbox/aspect-ratios-main-size-calculation.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..4a4d7b84cf513c5dca74bf0af9ca9a553dfc7748 |
--- /dev/null |
+++ b/LayoutTests/css3/flexbox/aspect-ratios-main-size-calculation.html |
@@ -0,0 +1,38 @@ |
+<!DOCTYPE html> |
+<link href="resources/flexbox.css" rel="stylesheet"> |
+<style> |
+.flexbox { |
+ background-color: #aaa; |
+} |
+ |
+.flexitem { |
+ background-color:red; |
+ -webkit-aspect-ratio: 1 / 2; |
+} |
+</style> |
+<script src="../../resources/check-layout.js"></script> |
+<body onload="checkLayout('.flexbox');"> |
+<p>Test for crbug.com/249112: In Flexbox, allow intrinsic aspect ratios to inform the main-size calculation</p> |
+<div class="flexbox"> |
+ <div class="flexitem" style="height:100px" data-expected-width="50" data-expected-height="100"></div> |
+</div> |
+ |
+<div class="flexbox" style="height:100px"> |
+ <div class="flexitem" style="height:50%" data-expected-width="25" data-expected-height="50"></div> |
+</div> |
+ |
+<div class="flexbox"> |
+ <img src="../images/resources/green-100x50.png" style="height:100px" data-expected-width="200" data-expected-height="100"> |
+</div> |
+ |
+<div class="flexbox"> |
+ <img class="flexitem" src="../images/resources/green-100x50.png" style="height:100px" data-expected-width="50" data-expected-height="100"> |
+</div> |
+ |
+<div class="flexbox" style="height:80px"> |
+ <img src="../images/resources/green-100x50.png" style="height:50%" data-expected-width="80" data-expected-height="40"> |
+</div> |
+ |
+<div class="flexbox" style="height:40px"> |
+ <img src="../images/resources/green-100x50.png" data-expected-width="80" data-expected-height="40"> |
+</div> |