<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> | |