CSS-based PDF: Make borders go all the way across page

mdslup
Posts: 65

CSS-based PDF: Make borders go all the way across page

Wed Aug 15, 2018 12:50 am

Here is what my @page looks like:

@page {
size: us-letter landscape;
column-count: 2;
column-gap: 0.5in;
margin-left: 0.1in;
margin-right: 0.1in;
margin-top: 0.1in;
margin-bottom: 0.5in;

}

I'd like to have a border go all the way across the bottom of the page and override the margins. When I add something like this to my @page:

border-left: 0.5in solid yellow

that border is still constrained by the left and right margins. Is there a way to make it extend all the way, regardless of the margins?
Costin
Posts: 402

Re: CSS-based PDF: Make borders go all the way across page

Wed Aug 15, 2018 12:06 pm

Hi,

You should just add an additional "@bottom-left-corner" page-margin-box selector inside your "@page" rule.
For the "@bottom-left-corner" you should set the same margin and border on its left side.
More specific:

Code: Select all

@page {
size: us-letter landscape;
column-count: 2;
column-gap: 0.5in;
margin-left: 0.1in;
margin-right: 0.1in;
margin-top: 0.1in;
margin-bottom: 0.5in;

border-left: 0.5in solid yellow;

@bottom-left-corner{
    content:"";
    margin-left: 0.1in;
    border-left: 0.5in solid yellow;
}
}

In the same way as you did for the content pages ("@page" selector), you could also add it to your cover page:

Code: Select all

@page front-page {
@bottom-left-corner{
    content:"";
    margin-left: 0.1in;
    border-left: 0.5in solid yellow;
}
}

Regards,
Costin
Costin Sandoi
oXygen XML Editor and Author Support

Return to “DITA (Editing and Publishing DITA Content)”

Who is online

Users browsing this forum: No registered users and 0 guests