Log in / Register

Forum › How do I...?

Removing a page from the PDF output with CSS

JohnClarke
Is there a way to remove a page from the PDF output if a certain element is found on that page?

For example:
If I want to remove all pages that have an element with the id "banana", I tried the following:
css
@page removed { visibility: hidden; }
div[id^="banana"] { page: removed; }


or if I want to remove all pages that have an element with class "banana", I tried the following:
css
@page removed { visibility: hidden; }
div.banana { page: removed; }


Unfortunately, neither of these ideas work. Does CSS/Prince allow for such an instruction?

John Clarke
Cornerstone Systems Northwest Inc.

mikeday
Hi John,

There is no way to specify in CSS that a page should be removed if a particular element appears on it. You can make the element itself disappear, but not the entire page that it appears on, and I must say that this is a rather unusual request! :)

Perhaps what you are trying to achieve could be done in another way?

Best regards,

Michael
JohnClarke
Hi Michael,

You're right, it is somewhat unusual! However, in the past I've been pleasantly surprised with what Prince can do and thought I'd just check about this before moving to plan B (which is to exclude the page before converting). :wink:

Thanks for your continued support.

-John

John Clarke
Cornerstone Systems Northwest Inc.

Lynx
@page removed { visibility: hidden; }


visibility property does not apply to pages but the same effect can be achived by setting right margin to 100%.

<?xml version="1.0" encoding="utf-8"?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
	<head>
	<title>Prince Rocks</title>
	<style type="text/css">
	.blank
		{page:blank;}
	@page blank
		{margin:0 0 0 100%;}
	</style>
	</head>
<body>
<div class="normal">Normal Page</div>
<div class="blank">Blank Page</div>
</body>
</html>


If you meant something like 

@page removed {display:none;}


then try:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
	<head>
	<title>Height of root element</title>
	<style type="text/css">
	.removed
		{page:removed;}
	.normal
		{page:normal;}
	@page removed
		{size:0;}
	</style>
	</head>
<body>
<div class="normal">Normal Page</div>
<div class="removed">Removed Page</div>
<div class="normal">Normal Page</div>
</body>
</html>
JohnClarke
Lynx,
Thanks for your help. Unfortunately, in both examples the pages are not actually removed from the PDF. The pages just get very small. In our use case we need the pages to go away visually and logically (page count, footers, headers). I think the only option left is to just remove the HTML for these pages before converting it with Prince.
-John

John Clarke
Cornerstone Systems Northwest Inc.