Forum How do I...?

Full-width footer directly under footer border

web559
When I specify an @bottom or @bottom-center footer like below, Prince leaves space between the border and the footer content.

I can see that this spacing prevents overlap with @bottom-right and @bottom-left, which go above @bottom. But in a document that doesn't have @bottom-right or @bottom-left content, how can I get a full-width footer to display directly below the footer's top border?

Here's the problem, in text:

What I'm getting:

_____________________________________

This is my @bottom content


What I want:

_____________________________________
This is my @bottom content



@page-first { 
    @bottom-left { content: none }
    @bottom-right { content: none }
    @bottom { 
        border-top: 1px solid black;
        content: flow(footer);
    }
}


I have tried negative margin-top and padding-top on @bottom and on my footer div, but neither worked.
jim_albright
Try adding a border around the footer. Sometimes this helps point out where the space is coming from.

Jim Albright
Wycliffe Bible Translators

mikeday
Minor note, @bottom-left and @bottom-right should be displayed adjacent to @bottom, not above it. How about applying "vertical-align: top", or some negative margin-top to the element that you are flowing?