Remove top margin above header R markdown/pagedown in html output - html

Question

I'm using Pagedown to generate a one-page html document that I can easily print to PDF with formatting (starting from html_paged default pagedown format).
I want to adjust the margin of my documents so that I use the full page space, especially at the top of the page, but I cannot seem to alter the margins. For example, there is always a (large) top margin above the first header of my document resulting in a blank space in my final document.
I'm using customized CSS style sheet to style my document. Setting the margins to 0 in this sheet doesnt reduce the margin in my final output, though the rest of the styling works fine. The page space remains limited.
I tried using:
* {
margin:0;
padding:2;
}
or
header{
margin-top: 0;
}
or resetting the margins of basically every element I could think of.
But nothing seems to work. Does anyone know what might be the issue?

Answer 1

You need to adjust the page margins via the margin-box properties.
See here for details on adjusting the margins: https://pagedjs.org/documentation/5-web-design-for-print/#margin-size-property
Starting from the default css pagedown files, if you were adjusting the first page then you’d want to adjust the margins in this part of the default-page.css file:
page :first {
#top-left {
content: none;
}
#top-right {
content: none;
}
#bottom-right {
content: none !important;
}
background-image: var(--front-cover);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
Here’s an example of custom page margins:
#page {
margin-top: 20mm;
margin-bottom: 25mm;
margin-left: 10mm;
margin-right: 35mm;
}