Menu
I have been trying to add pseudo elements with content into the CSS for a page that is being converted with the Flying Saucer library. When viewing the page in a regular browser as HTML, the code works fine and I can see the pseudo element (:before). When rendering the PDF using Flying Saucer however, the pseudo element disappears.
According to the official Flying Saucer spec, CSS 2.1 is supported so that should include pseudo elements and content attributes. So why isn't it working for me? All other CSS is working fine.
783
Besides of CSS2.1 pseudo-elements listed in the CSSParser, which are:
first-linefirst-letterbeforeafterFlying Saucer supports following pseudo-elements for output rendering:
first-childevenoddlast-childSome browser related/interactive pseudo-elements are supported as well:
linkvisitedhoverfocusactiveSee the source code of addPseudoClassOrElement.
84
Flying-saucer supports the following CSS pseudo elements:
before after first-linefirst-letterIt only supports the standard, double-colon CSS3 syntax (::after), and not the old, single-colon CSS2 syntax (:after).
Here is a working example:
<html>
<head>
<style>
div::before {content: "before - "}
div::after {content: " - after"}
p::first-line {font-weight:bold}
p::first-letter {color:blue}
</style>
</head>
<body>
<div>A div</div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus sed scelerisque augue. Nulla eleifend aliquet tortor, vel placerat velit fringilla vitae. Sed quis sem eu arcu dapibus convallis.</p>
</body>
</html>
And the result (using flying-saucer 9.1.6):
33
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
