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> |