mirror of
https://github.com/mozilla/gecko-dev.git
synced 2025-11-11 21:58:41 +02:00
1d9d076408
Automatic update from web-platform-tests [LayoutNG] Simplify & correct static position for OOF positioned. This patch is primarily simplifies how we determine the static position for an OOF positioned node, within the inline context. There are many fixes, (see test cases). Additionally, fixed positioned nodes, now work when they have an inline level containing block. Bug: 636993 Change-Id: I36b573578fc85d9ba9b757f258ec7391eec73c0a Reviewed-on: https://chromium-review.googlesource.com/c/1356999 Commit-Queue: Ian Kilpatrick <ikilpatrick@chromium.org> Reviewed-by: Aleks Totic <atotic@chromium.org> Reviewed-by: Morten Stenshorne <mstensho@chromium.org> Reviewed-by: Koji Ishii <kojii@chromium.org> Cr-Commit-Position: refs/heads/master@{#614426} -- wpt-commits: 047734d5161fe23a3c0dc600b56354f5cb9086ec wpt-pr: 14359
73 lines
2.4 KiB
HTML
73 lines
2.4 KiB
HTML
<!DOCTYPE html>
|
|
<link rel="help" href="https://drafts.csswg.org/css2/visudet.html#abs-non-replaced-width" />
|
|
<link rel="match" href="htb-ref.html">
|
|
<meta name="assert" content="This test checks the static position of an out of flow absolute positioned element, under various conditions." />
|
|
<style>
|
|
.container {
|
|
position: relative;
|
|
background: green;
|
|
color: green;
|
|
font: 16px/1 Ahem;
|
|
border: solid black 3px;
|
|
width: 400px;
|
|
margin: 16px 0;
|
|
}
|
|
.red { color: red; }
|
|
.cb { position: relative; }
|
|
.rtl { direction: rtl; }
|
|
.ltr { direction: ltr; }
|
|
.inline { display: inline; }
|
|
.abs { position: absolute; }
|
|
|
|
.indent { text-indent: 20px; }
|
|
* { text-indent: initial; }
|
|
</style>
|
|
|
|
There should be no red.
|
|
<div class="container rtl">
|
|
XXX<span class="rtl">XX<div class="abs inline">XXXXX</div><span class="red">XXXXX</span></span>
|
|
</div>
|
|
|
|
<div class="container rtl indent">
|
|
XXX<span class="rtl">XX<div class="abs inline">XXXXX</div><span class="red">XXXXX</span></span>
|
|
</div>
|
|
|
|
<div class="container rtl">
|
|
XXX<span class="rtl">XX<div class="abs block">XXXXX</div><br><span class="red">XXXXX</span></span>
|
|
</div>
|
|
|
|
<div class="container rtl indent">
|
|
XXX<span class="rtl">XX<div class="abs block">XXXXX</div><br><span class="red">XXXXX</span></span>
|
|
</div>
|
|
|
|
<div class="container rtl">
|
|
XXX<span class="rtl cb">XX<div class="abs inline">XXXXX</div><span class="red">XXXXX</span></span>
|
|
</div>
|
|
|
|
<div class="container rtl indent">
|
|
XXX<span class="rtl cb">XX<div class="abs inline">XXXXX</div><span class="red">XXXXX</span></span>
|
|
</div>
|
|
|
|
<div class="container rtl">
|
|
XXX<span class="rtl cb">XX<div class="abs block">XXXXX</div><br><span class="red">XXXXX</span></span>
|
|
</div>
|
|
|
|
<div class="container rtl indent">
|
|
XXX<span class="rtl cb">XX<div class="abs block">XXXXX</div><br><span class="red">XXXXX</span></span>
|
|
</div>
|
|
|
|
<div class="container rtl">
|
|
<span class="cb">XXX<span class="rtl">XX<div class="abs inline">XXXXX</div><span class="red">XXXXX</span></span></span>
|
|
</div>
|
|
|
|
<div class="container rtl indent">
|
|
<span class="cb">XXX<span class="rtl">XX<div class="abs inline">XXXXX</div><span class="red">XXXXX</span></span></span>
|
|
</div>
|
|
|
|
<div class="container rtl">
|
|
<span class="cb">XXX<span class="rtl">XX<div class="abs block">XXXXX</div><br><span class="red">XXXXX</span></span></span>
|
|
</div>
|
|
|
|
<div class="container rtl indent">
|
|
<span class="cb">XXX<span class="rtl">XX<div class="abs block">XXXXX</div><br><span class="red">XXXXX</span></span></span>
|
|
</div>
|