white_space.rml 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354
  1. <rml>
  2. <head>
  3. <title>White space collapsing</title>
  4. <link type="text/rcss" href="../style.rcss"/>
  5. <link rel="help (css2)" href="https://drafts.csswg.org/css2/#white-space-prop" />
  6. <link rel="help (css3)" href="https://www.w3.org/TR/css-text-3/#white-space-rules" />
  7. <link rel="Issue #383" href="https://github.com/mikke89/RmlUi/issues/383" />
  8. <meta name="Assert" content="The 'I' and 'ABC' lines should be horizontally centered, intersecting the vertical guideline." />
  9. <meta name="Assert" content="Each 'hello world' text should have the same spacing." />
  10. <meta name="Assert" content="Each 'duck' should have spacing to the next one." />
  11. <style>
  12. .center {
  13. margin: 10dp auto;
  14. width: 120dp;
  15. height: 50dp;
  16. background-color: #252526;
  17. text-align: center;
  18. text-transform: uppercase;
  19. color: white;
  20. padding: 0;
  21. font-size: 50dp;
  22. }
  23. .autoheight { height: auto; }
  24. .guideline {
  25. position: absolute;
  26. left: 50%;
  27. top: 0;
  28. width: 1dp;
  29. height: 100%;
  30. background-color: #f2a;
  31. }
  32. </style>
  33. </head>
  34. <body>
  35. <div class="center" id="none">I</div>
  36. <div class="center" id="left"> I</div>
  37. <div class="center" id="right">I </div>
  38. <div class="center" id="both"> I </div>
  39. <div class="center" id="newlines">
  40. I
  41. </div>
  42. <div class="center autoheight" id="wrap"> ABC ABC ABC ABC </div>
  43. <div class="guideline"/>
  44. <h1>Hello World!</h1>
  45. <h1> Hello
  46. <span> World!</span> </h1>
  47. <p><span>Duck!</span> <span>Duck!</span> <span>Duck!</span></p>
  48. <p><span>Duck! </span><span>Duck! </span><span>Duck! </span></p>
  49. <p>Duck! Duck! Duck!</p>
  50. </body>
  51. </rml>