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

Unified Diff: third_party/WebKit/LayoutTests/css3/logical-props/logicalprops-inline-size.html

Issue 2577363002: Implement CSS Logical Properties: inline/block size (Closed)
Patch Set: Refactor test case, add {inline-,block-}size overrides width height Created 4 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/css3/logical-props/logicalprops-inline-size.html
diff --git a/third_party/WebKit/LayoutTests/css3/logical-props/logicalprops-inline-size.html b/third_party/WebKit/LayoutTests/css3/logical-props/logicalprops-inline-size.html
new file mode 100644
index 0000000000000000000000000000000000000000..b662aab2615805f4b84247f36676b896b954f454
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/css3/logical-props/logicalprops-inline-size.html
@@ -0,0 +1,84 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>CSS Logical Properties: {max-,min-}inline-size</title>
+<link rel="help" href="https://drafts.csswg.org/css-logical-props/">
+<link rel="help" href="https://drafts.csswg.org/css-writing-modes/#logical-to-physical">
+
+<style>
+table {
+ border: 1px solid #000;
+ display: table;
+}
+#table1_column {
+ inline-size: 40px;
+ min-inline-size: 50px;
+ max-inline-size: 100px;
+ height: 100px;
+ background-color: red;
+ display: table-cell;
+}
+#table2_column {
+ inline-size: 100px;
+ min-inline-size: 50px;
+ max-inline-size: 100px;
+ height: 100px;
+ background-color: blue;
+ display: table-cell;
+}
+#table3_column {
+ inline-size: 120px;
+ min-inline-size: 50px;
+ max-inline-size: 100px;
+ height: 100px;
+ background-color: green;
+ display: table-cell;
+}
+
+#div1 {
+ inline-size: 40px;
+ min-inline-size: 50px;
+ max-inline-size: 100px;
+ border: 1px solid #000;
+}
+#div2 {
+ inline-size: 100px;
+ min-inline-size: 50px;
+ max-inline-size: 100px;
+ border: 1px solid #000;
+}
+#div3 {
+ inline-size: 120px;
+ min-inline-size: 50px;
+ max-inline-size: 100px;
+ border: 1px solid #000;
+}
+
+p {
+ border: 1px solid #000;
+}
+#p1 {
+ inline-size: 100px;
+ width: 50px;
+}
+#p2 {
+ width: 50px;
+ inline-size: 100px;
+}
+</style>
+
+<div id="table1">
+ <div id="table1_column"></div>
+</div>
+<div id="table2">
+ <div id="table2_column"></div>
+</div>
+<div id="table3">
+ <div id="table3_column"></div>
+</div>
+
+<div id="div1">Hello, this is a test</div>
+<div id="div2">Hello, this is a test</div>
+<div id="div3">Hello, this is a test</div>
+
+<p id="p1">Hello, this is a test</div>
+<p id="p2">Hello, this is a test</div>

Powered by Google App Engine
This is Rietveld 408576698