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

Unified Diff: LayoutTests/fast/css/css-properties-position-relative-as-parent-fixed-expected.html

Issue 669143002: Make css-properties-position-relative-as-parent-fixed.html a ref-test (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: New version using a ref-test Created 6 years, 2 months 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: LayoutTests/fast/css/css-properties-position-relative-as-parent-fixed-expected.html
diff --git a/LayoutTests/fast/css/css-properties-position-relative-as-parent-fixed-expected.html b/LayoutTests/fast/css/css-properties-position-relative-as-parent-fixed-expected.html
new file mode 100644
index 0000000000000000000000000000000000000000..c1d96d16b27b73c58c4db60d11eeca46b1d1fb2a
--- /dev/null
+++ b/LayoutTests/fast/css/css-properties-position-relative-as-parent-fixed-expected.html
@@ -0,0 +1,161 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <style>
+ h5 {
+ margin: 0;
+ }
+
+ .container {
+ position: relative;
+ left: 150px;
+ font-size: 0.8em;
+ }
+
+ .main {
+ width: 400px;
+ }
+
+ .relative {
+ position: relative;
+ }
+
+ .fixed {
+ position: fixed;
+ }
+
+ .green {
+ background-color: lime;
+ }
+
+ .blue {
+ background-color: cyan;
+ }
+
+ .grey {
+ background-color: silver;
+ }
+
+ .rtl {
+ direction: rtl;
+ }
+
+ .inline {
+ display: inline-block;
+ }
+ </style>
+</head>
+<body>
+ <h3>Test for chromium bug : <a href="https://code.google.com/p/chromium/issues/detail?id=31286">31286</a>. css rendering bug : fixed-position-element and 'left'.</h3>
+ <p>If fixed position inline element does not have left and/or right position then it should render as normal flow.</p>
+
+ <h5>Case 1: fixed text box (blue) should be just after relative text box (green).</h5>
+ <div class="container">
+ <div class="main relative green" style="left: 100px;">
+ relative<div class="inline blue">fixed</div>
+ </div>
+ </div>
+
+ <h5>Case 2: fixed text box (blue) should be just before relative text box (green).</h5>
+ <div class="container">
+ <div class="main relative green rtl" style="left: 100px;">
+ relative<div class="inline blue">fixed</div>
+ </div>
+ </div>
+
+ <h5>Case 3: fixed text box (blue) should be just after relative text box (green).</h5>
+ <div class="container">
+ <div class="main relative green" style="right: 100px;">
+ relative<div class="inline blue">fixed</div>
+ </div>
+ </div>
+
+ <h5>Case 4: fixed text box (blue) should be just before relative text box (green).</h5>
+ <div class="container">
+ <div class="main relative green rtl" style="right: 100px;">
+ relative<div class="inline blue">fixed</div>
+ </div>
+ </div>
+
+ <h5>Case 5: fixed text box (blue) should be just after relative2 text box (green).</h5>
+ <div class="container">
+ <div class="main relative grey" style="left: 100px;">
+ relative
+ <span class="relative green" style="left: 50px;">
+ relative2<div class="inline blue">fixed</div>
+ </span>
+ </div>
+ </div>
+
+ <h5>Case 6: fixed text box (blue) should be after relative text box (grey) in some distance and before the other relative2 text box (green) in some distance.</h5>
+ <div class="container">
+ <div class="main relative grey rtl" style="left: 100px;">
+ relative
+ <span class="relative green" style="left: 100px;">
+ relative2<div class="inline blue">fixed</div>
+ </span>
+ </div>
+ </div>
+
+ <h5>Case 7: fixed text box (blue) should be just after relative2 text box (green).</h5>
+ <div class="container">
+ <div class="main relative grey" style="left: 100px;">
+ relative
+ <span class="relative green" style="right: 50px;">
+ relative2<div class="inline blue">fixed</div>
+ </span>
+ </div>
+ </div>
+
+ <h5>Case 8: fixed text box (blue) should be before relative2 text box (green) in some distance.</h5>
+ <div class="container">
+ <div class="main relative grey rtl" style="left: 100px;">
+ relative
+ <span class="relative green" style="right: 150px;">
+ relative2<div class="inline blue">fixed</div>
+ </span>
+ </div>
+ </div>
+
+ <h5>Case 9: fixed text box (blue) should be just after relative2 text box (green).</h5>
+ <div class="container">
+ <div class="main relative grey" style="right: 100px;">
+ relative
+ <span class="relative green" style="left: 50px;">
+ relative2<div class="inline blue">fixed</div>
+ </span>
+ </div>
+ </div>
+
+ <h5>Case 10: fixed text box (blue) should be after relative text box (grey) in some distance and before other relative2 text box (green) in some distance.</h5>
+ <div class="container">
+ <div class="main relative grey rtl" style="right: 100px;">
+ relative
+ <span class="relative green" style="left: 150px;">
+ relative2<div class="inline blue">fixed</div>
+ </span>
+ </div>
+ </div>
+
+ <h5>Case 11: fixed text box (blue) should be just after relative2 text box (green).</h5>
+ <div class="container">
+ <div class="main relative grey" style="right: 100px;">
+ relative
+ <span class="relative green" style="right: 50px;">
+ relative2<div class="inline blue">fixed</div>
+ </span>
+ </div>
+ </div>
+
+ <h5>Case 12: fixed text box (blue) should be before relative2 text box (green) in some distance.</h5>
+ <div class="container">
+ <div class="main relative grey rtl" style="right: 100px;">
+ relative
+ <span class="relative green" style="right: 150px;">
+ relative2<div class="inline blue">fixed</div>
+ </span>
+ </div>
+ </div>
+
+</body>
+</html>

Powered by Google App Engine
This is Rietveld 408576698