File: floats-line-wrap-shifted-001.html

package info (click to toggle)
firefox-esr 78.15.0esr-1~deb11u1
  • links: PTS, VCS
  • area: main
  • in suites: bullseye
  • size: 3,301,156 kB
  • sloc: cpp: 5,665,905; javascript: 4,798,386; ansic: 2,878,233; python: 977,004; asm: 270,347; xml: 181,456; java: 111,756; sh: 72,926; makefile: 21,819; perl: 13,380; cs: 4,725; yacc: 4,565; objc: 3,026; pascal: 1,787; lex: 1,720; ada: 1,681; exp: 505; php: 436; lisp: 260; awk: 152; ruby: 103; csh: 80; sed: 53; sql: 45
file content (45 lines) | stat: -rw-r--r-- 1,168 bytes parent folder | download | duplicates (10) 
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
45
 
<!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="flags" content="" />
<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>