Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(39)

Unified Diff: third_party/WebKit/LayoutTests/fast/css-intrinsic-dimensions/definite-minmax-content-inlinesize-contribution-nonreplaced-blocks.html

Issue 1504403002: Fix computation of min|max-content contribution of non-replaced blocks (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Reworked patch & tests Created 5 years ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: third_party/WebKit/LayoutTests/fast/css-intrinsic-dimensions/definite-minmax-content-inlinesize-contribution-nonreplaced-blocks.html
diff --git a/third_party/WebKit/LayoutTests/fast/css-intrinsic-dimensions/definite-minmax-content-inlinesize-contribution-nonreplaced-blocks.html b/third_party/WebKit/LayoutTests/fast/css-intrinsic-dimensions/definite-minmax-content-inlinesize-contribution-nonreplaced-blocks.html
new file mode 100644
index 0000000000000000000000000000000000000000..c3eac92968f3713fa0c9f43978ea57a015ac4a0e
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/fast/css-intrinsic-dimensions/definite-minmax-content-inlinesize-contribution-nonreplaced-blocks.html
@@ -0,0 +1,167 @@
+<!DOCTYPE html>
+
+<style>
+@import "resources/width-keyword-classes.css";
+@import "resources/intrinsic-size-contribution.css";
+
+.fixed {
+ width: 50px;
+}
+
+.percent {
+ width: 50%;
+}
+</style>
+
+<script src="../../resources/testharness.js"></script>
+<script src="../../resources/testharnessreport.js"></script>
+<script src="../../resources/check-layout-th.js"></script>
+
+<body onload="checkLayout('.container')">
+<div id=log></div>
+
+<!-- min-content contribution of fixed sizes -->
+<div class="container min-content" data-expected-width="60" data-expected-height="40" data-expected-client-width="50" data-expected-client-height="30">
+ <div class="item fixed" data-expected-width="50" data-expected-height="30"></div>
+</div>
+
+<div class="container min-content" data-expected-width="70" data-expected-height="50" data-expected-client-width="60" data-expected-client-height="40">
+ <div class="item fixed border" data-expected-width="60" data-expected-height="40" data-expected-client-width="50" data-expected-client-height="30"></div>
+</div>
+
+<div class="container min-content" data-expected-width="80" data-expected-height="60" data-expected-client-width="70" data-expected-client-height="50">
+ <div class="item fixed padding" data-expected-width="70" data-expected-height="50" data-expected-client-width="70" data-expected-client-height="50"></div>
+</div>
+
+<div class="container min-content" data-expected-width="100" data-expected-height="80" data-expected-client-width="90" data-expected-client-height="70">
+ <div class="item fixed margin" data-expected-width="50" data-expected-height="30" data-expected-client-width="50" data-expected-client-height="30"></div>
+</div>
+
+<div class="container min-content" data-expected-width="90" data-expected-height="70" data-expected-client-width="80" data-expected-client-height="60">
+ <div class="item fixed border padding" data-expected-width="80" data-expected-height="60" data-expected-client-width="70" data-expected-client-height="50"></div>
+</div>
+
+<div class="container min-content" data-expected-width="110" data-expected-height="90" data-expected-client-width="100" data-expected-client-height="80">
+ <div class="item fixed border margin" data-expected-width="60" data-expected-height="40" data-expected-client-width="50" data-expected-client-height="30"></div>
+</div>
+
+<div class="container min-content" data-expected-width="130" data-expected-height="110" data-expected-client-width="120" data-expected-client-height="100">
+ <div class="item fixed border padding margin" data-expected-width="80" data-expected-height="60" data-expected-client-width="70" data-expected-client-height="50"></div>
+</div>
+
+<!-- min-content contribution of definite percentages -->
+<div class="container min-content" data-expected-width="60" data-expected-height="40" data-expected-client-width="50" data-expected-client-height="30">
+ <div style="width: 50px;">
+ <div class="item percent" data-expected-width="25" data-expected-height="30"></div>
+ </div>
+</div>
+
+<div class="container min-content" data-expected-width="70" data-expected-height="50" data-expected-client-width="60" data-expected-client-height="40">
+ <div style="width: 60px;">
+ <div class="item percent border" data-expected-width="40" data-expected-height="40" data-expected-client-width="30" data-expected-client-height="30"></div>
+ </div>
+</div>
+
+<div class="container min-content" data-expected-width="80" data-expected-height="60" data-expected-client-width="70" data-expected-client-height="50">
+ <div style="width: 70px;">
+ <div class="item percent padding" data-expected-width="55" data-expected-height="50" data-expected-client-width="55" data-expected-client-height="50"></div>
+ </div>
+</div>
+
+<div class="container min-content" data-expected-width="100" data-expected-height="80" data-expected-client-width="90" data-expected-client-height="70">
+ <div style="width: 90px;">
+ <div class="item percent margin" data-expected-width="45" data-expected-height="30" data-expected-client-width="45" data-expected-client-height="30"></div>
+ </div>
+</div>
+
+<div class="container min-content" data-expected-width="90" data-expected-height="70" data-expected-client-width="80" data-expected-client-height="60">
+ <div style="width: 80px;">
+ <div class="item percent border padding" data-expected-width="70" data-expected-height="60" data-expected-client-width="60" data-expected-client-height="50"></div>
+ </div>
+</div>
+
+<div class="container min-content" data-expected-width="110" data-expected-height="90" data-expected-client-width="100" data-expected-client-height="80">
+ <div style="width: 100px;">
+ <div class="item percent border margin" data-expected-width="60" data-expected-height="40" data-expected-client-width="50" data-expected-client-height="30"></div>
+ </div>
+</div>
+
+<div class="container min-content" data-expected-width="130" data-expected-height="110" data-expected-client-width="120" data-expected-client-height="100">
+ <div style="width: 120px;">
+ <div class="item percent border padding margin" data-expected-width="90" data-expected-height="60" data-expected-client-width="80" data-expected-client-height="50"></div>
+ </div>
+</div>
+
+<!-- max-content contribution of fixed sizes -->
+<div class="container max-content" data-expected-width="60" data-expected-height="40" data-expected-client-width="50" data-expected-client-height="30">
+ <div class="item fixed" data-expected-width="50" data-expected-height="30"></div>
+</div>
+
+<div class="container max-content" data-expected-width="70" data-expected-height="50" data-expected-client-width="60" data-expected-client-height="40">
+ <div class="item fixed border" data-expected-width="60" data-expected-height="40" data-expected-client-width="50" data-expected-client-height="30"></div>
+</div>
+
+<div class="container max-content" data-expected-width="80" data-expected-height="60" data-expected-client-width="70" data-expected-client-height="50">
+ <div class="item fixed padding" data-expected-width="70" data-expected-height="50" data-expected-client-width="70" data-expected-client-height="50"></div>
+</div>
+
+<div class="container max-content" data-expected-width="100" data-expected-height="80" data-expected-client-width="90" data-expected-client-height="70">
+ <div class="item fixed margin" data-expected-width="50" data-expected-height="30" data-expected-client-width="50" data-expected-client-height="30"></div>
+</div>
+
+<div class="container max-content" data-expected-width="90" data-expected-height="70" data-expected-client-width="80" data-expected-client-height="60">
+ <div class="item fixed border padding" data-expected-width="80" data-expected-height="60" data-expected-client-width="70" data-expected-client-height="50"></div>
+</div>
+
+<div class="container max-content" data-expected-width="110" data-expected-height="90" data-expected-client-width="100" data-expected-client-height="80">
+ <div class="item fixed border margin" data-expected-width="60" data-expected-height="40" data-expected-client-width="50" data-expected-client-height="30"></div>
+</div>
+
+<div class="container max-content" data-expected-width="130" data-expected-height="110" data-expected-client-width="120" data-expected-client-height="100">
+ <div class="item fixed border padding margin" data-expected-width="80" data-expected-height="60" data-expected-client-width="70" data-expected-client-height="50"></div>
+</div>
+
+<!-- max-content contribution of definite percentages -->
+<div class="container max-content" data-expected-width="60" data-expected-height="40" data-expected-client-width="50" data-expected-client-height="30">
+ <div style="width: 50px;">
+ <div class="item percent" data-expected-width="25" data-expected-height="30"></div>
+ </div>
+</div>
+
+<div class="container max-content" data-expected-width="70" data-expected-height="50" data-expected-client-width="60" data-expected-client-height="40">
+ <div style="width: 60px;">
+ <div class="item percent border" data-expected-width="40" data-expected-height="40" data-expected-client-width="30" data-expected-client-height="30"></div>
+ </div>
+</div>
+
+<div class="container max-content" data-expected-width="80" data-expected-height="60" data-expected-client-width="70" data-expected-client-height="50">
+ <div style="width: 70px;">
+ <div class="item percent padding" data-expected-width="55" data-expected-height="50" data-expected-client-width="55" data-expected-client-height="50"></div>
+ </div>
+</div>
+
+<div class="container max-content" data-expected-width="100" data-expected-height="80" data-expected-client-width="90" data-expected-client-height="70">
+ <div style="width: 90px;">
+ <div class="item percent margin" data-expected-width="45" data-expected-height="30" data-expected-client-width="45" data-expected-client-height="30"></div>
+ </div>
+</div>
+
+<div class="container max-content" data-expected-width="90" data-expected-height="70" data-expected-client-width="80" data-expected-client-height="60">
+ <div style="width: 80px;">
+ <div class="item percent border padding" data-expected-width="70" data-expected-height="60" data-expected-client-width="60" data-expected-client-height="50"></div>
+ </div>
+</div>
+
+<div class="container max-content" data-expected-width="110" data-expected-height="90" data-expected-client-width="100" data-expected-client-height="80">
+ <div style="width: 100px;">
+ <div class="item percent border margin" data-expected-width="60" data-expected-height="40" data-expected-client-width="50" data-expected-client-height="30"></div>
+ </div>
+</div>
+
+<div class="container max-content" data-expected-width="130" data-expected-height="110" data-expected-client-width="120" data-expected-client-height="100">
+ <div style="width: 120px;">
+ <div class="item percent border padding margin" data-expected-width="90" data-expected-height="60" data-expected-client-width="80" data-expected-client-height="50"></div>
+ </div>
+</div>
+
+</body>

Powered by Google App Engine
This is Rietveld 408576698