summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/css/CSS2/floats/floats-line-wrap-shifted-001.html
blob: 5eb1a8f2b14da34a7a853d4f1863c4c1b10a94ac (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
<!DOCTYPE html>
<link rel="author" title="Koji Ishii" href="kojii@chromium.org">
<link rel="help" href="https://drafts.csswg.org/css2/visuren.html#float-position">
<link rel="match" href="floats-line-wrap-shifted-001-ref.html">
<meta name="assert" content="Float may not be higher than line-box containing a box generated by an element earlier in the source document." />

<style>
div {
  font-size: 10px;
  width: 12ch;
  line-height: 1;
  background: yellow;
}
.float {
  float: left;
  width: 12ch;
  height: 1em;
  background: orange;
}
</style>

<body>
<div>
  1111
  <nobr>
    2222
<!--
  This float does not fit in the 1st line and thus shifted downward.
-->
    <div class="float"></div>
<!--
  The next word causes the 1st line to wrap.
  The last break opportunity was before the float, and thus the float is also
  wrapped to the next line.

  According to the rule 6, the float should be below <nobr> box.
  6. The outer top of an element's floating box may not be higher than the top
     of any line-box containing a box generated by an element earlier in the
     source document.
-->
    3333
  </nobr>
</div>
</body>