Create
cancel
Showing results for 
Search instead for 
Did you mean: 
Sign up Log in
It's not the same without you

Join the community to find out what other Atlassian users are discussing, debating and creating.

Atlassian Community Hero Image Collage

How do I fix the right margin on the title page of a PDF export?

I'm currently trying to get a background image to fill the entire page when I export to PDF. I've tried all sorts of tactics, but there seems to be an impenetrable right margin that I can't escape. I've changed the title page's margins to 0 and also changed the top-right and bottom-right margins 0, but it only impacts every other margin--not the right margin.

margin.PNG

Is this a bug, or am I overlooking something obvious? I'm no expert with html/css, so that's quite possible.

This is what I currently have for my css, which is as close as I've gotten to getting it to work:

@page title
{
margin-left: 0in !important;
margin-right: 0in !important;
margin-top: 0in !important;
margin-bottom: 0in !important;
padding: 0px !important;

@top-left
{
}
@bottom-left
{
}
@top-right
{
margin-right:0in;
}
@bottom-right
margin-right:0in;

...

div.titlepage
{
background-image: url("/download/attachments/657195009/title-page.png?api=v2");
page-break-after:always;
background-size: 100% 100%;
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center center;
}

 

1 answer

1 accepted

1 vote
Answer accepted

FINALLY!

This accomplished what I want:

<div class="titlepage">
<div class=fsTitle>Text</div>
</div>
@page title
{
margin-left: 0in !important;
margin-right: 0in !important;
margin-top: 0in !important;
margin-bottom: 0in !important;
padding: 0px !important;
height:100%;

@top-left
{
}
@bottom-left
{
}
@top-right
{
margin-right:0in;
}
@bottom-right
margin-right:0in;
{
}
}

div.titlepage
{
page:title;
margin-left: 0;
margin-right: 0;
text-align:center;
background-image: url("/download/attachments/657195009/title-page.png?api=v2");
page-break-after:always;
background-size: 100% 100%;
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center center;
padding-left:1000px;

Some of this CSS is undoubtedly redundant or unnecessary, but the image fits the page, is centered, and no longer runs up against the right margin. 

Kishan Sharma Community Leader Dec 09, 2021

Great that you got it sorted @Tom Seedorf , you can mark your answer as accepted :)

Suggest an answer

Log in or Sign up to answer
DEPLOYMENT TYPE
CLOUD
PRODUCT PLAN
STANDARD
TAGS
Community showcase
Published in Confluence Cloud

🏠 Say hello to the new Confluence Home!

Hi Atlassian Community, My name is DJ Chung, and I’m a Product Manager on the Confluence Cloud team. Today, I’m excited to share a new and improved version of Home. The new Home helps you ...

43,960 views 33 137
Read article

Community Events

Connect with like-minded Atlassian users at free events near you!

Find an event

Connect with like-minded Atlassian users at free events near you!

Unfortunately there are no Community Events near you at the moment.

Host an event

You're one step closer to meeting fellow Atlassian users at your local event. Learn more about Community Events

Events near you