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..879a7ea71b1252741b1d63d85bf82ee6d00f2006 |
--- /dev/null |
+++ b/LayoutTests/fast/css/css-properties-position-relative-as-parent-fixed-expected.html |
@@ -0,0 +1,162 @@ |
+<!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; |
+ position: relative; |
+ } |
+ </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: 100px;"> |
+ 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: 100px;"> |
+ 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: 100px;"> |
+ 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: 100px;"> |
+ 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: 100px;"> |
+ 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: 100px;"> |
+ 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: 100px;"> |
+ relative2<div class="inline blue">fixed</div> |
+ </span> |
+ </div> |
+ </div> |
+ |
+</body> |
+</html> |