inline_formatting_04.rml 1.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. <rml>
  2. <head>
  3. <title>Inline formatting 04</title>
  4. <link type="text/rcss" href="../style.rcss"/>
  5. <link rel="help" href="https://www.w3.org/TR/css-inline-3/#line-boxes" />
  6. <meta name="Description" content="Split line boxes." />
  7. <style>
  8. body {
  9. padding: 0;
  10. border: 12px #ddd;
  11. }
  12. hr {
  13. clear: both;
  14. margin: 15px;
  15. display: block;
  16. }
  17. span { color: red; }
  18. .wrap {
  19. border: 8px #ee0;
  20. background: #ada;
  21. line-height: 3em;
  22. }
  23. .inner {
  24. color: blue;
  25. border: 15px #f663;
  26. border-width: 5px 30px;
  27. }
  28. </style>
  29. </head>
  30. <body rmlui-debug-layout>
  31. <span><br/></span>
  32. <span class="wrap">
  33. Before<span class="inner"> Inner </span>After
  34. </span>
  35. <hr/>
  36. <span class="wrap">
  37. <span class="inner"><span class="inner">
  38. <span class="inner">
  39. <div>Y</div>
  40. </span>
  41. <span>Z</span>
  42. </span></span>
  43. </span>
  44. <hr/>
  45. <span class="wrap">
  46. <span class="inner"><br/></span>
  47. <span>Z</span>
  48. </span>
  49. <hr/>
  50. <span class="wrap">
  51. <span class="inner"><br/>Y</span>
  52. <span>Z</span>
  53. </span>
  54. <handle size_target="#document"/>
  55. </body>
  56. </rml>