| <html> |
| <head> |
| <style type="text/css"> |
| p { |
| border:medium solid blue; |
| width: 5em; |
| } |
| |
| p.a:before{ |
| content: "AAAAAAAAA"; |
| } |
| |
| p.ab:before{ |
| content: "AAAA BBBB"; |
| } |
| |
| p.az:before{ |
| content: "AAAAAAAAA"; |
| } |
| p.az:after{ |
| content: "ZZZZZZZZZ"; |
| } |
| |
| p.yz:after{ |
| content: "YYYY ZZZZ"; |
| } |
| |
| p.z:after{ |
| content: "ZZZZZZZZZ"; |
| } |
| </style> |
| </head> |
| |
| <body> |
| <!-- line break must not occur at pseudo element (:before, :after) boundaries. --> |
| <p><span>AAAAAAAAA</span>AA BB</p> |
| <p><span>AAAAAAAAA</span>AAAAA</p> |
| <p><span>AAAA</span> <span>BBBB</span>BBBBB</p> |
| <p><span>AAAAAAAAA</span>AA ZZ<span>ZZZZZZZZZ</span></p> |
| <p><span>AAAAAAAAA</span>MMMMM<span>ZZZZZZZZZ</span></p> |
| <p>YYYYY<span>YYYY</span> <span>ZZZZ</span></p> |
| <p>YY ZZ<span>ZZZZZZZZZ</span></p> |
| <p>ZZZZZ<span>ZZZZZZZZZ</span></p> |
| </html> |
| |
