box-decoration-break-1.html 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
  1. <!DOCTYPE HTML>
  2. <!--
  3. Any copyright is dedicated to the Public Domain.
  4. http://creativecommons.org/publicdomain/zero/1.0/
  5. -->
  6. <html>
  7. <head>
  8. <title>CSS Test: Testing box-decoration-break:clone</title>
  9. <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=613659">
  10. <link rel="help" href="http://dev.w3.org/csswg/css-break/#break-decoration">
  11. <link rel="match" href="box-decoration-break-1-ref.html">
  12. <meta charset="utf-8">
  13. <style>
  14. span {
  15. box-decoration-break:clone;
  16. line-height:4em;
  17. font-family:monospace;
  18. padding: 3px 5px 7px 11px;
  19. background-color: #0F0;
  20. margin: 13px 17px 19px 23px;
  21. border-left:13px dashed pink;
  22. border-top:7px dashed blue;
  23. border-right:3px dashed black;
  24. border-bottom:1px dashed blue;
  25. }
  26. .o0 {
  27. border-radius: 17px;
  28. }
  29. .o10 {
  30. border-radius: 17px;
  31. margin-left:0;
  32. }
  33. .o10x {
  34. border-radius: 17px;
  35. padding-right:0;
  36. }
  37. .so0 {
  38. border-radius: 0px;
  39. }
  40. .so10 {
  41. border-radius: 0px;
  42. margin-right:0;
  43. }
  44. .so10x {
  45. border-radius: 0px;
  46. padding-left:0;
  47. }
  48. </style>
  49. </head>
  50. <body style="margin:10px">
  51. <table border=1 cellpadding=10><tr>
  52. <td><span class="o0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span></td>
  53. <td><span class="o10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span></td>
  54. <td><span class="o10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span></td>
  55. </tr>
  56. </table>
  57. <br>
  58. <table border=1 cellpadding=10><tr>
  59. <td><span class="so0"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br></td>
  60. <td><span class="so10"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br></td>
  61. <td><span class="so10x"><b>&nbsp;&nbsp;a&nbsp;&nbsp;<br>&nbsp;&nbsp;b&nbsp;&nbsp;<br>&nbsp;&nbsp;c&nbsp;&nbsp;</b></span><br></td>
  62. </tr>
  63. </table>
  64. </body>
  65. </html>