Search code examples
htmlrr-markdownknitr

Adjust spacing between title and subtitle of html_document output from Rmarkdown


I am trying to adjust the vertical spacing between the main title and subtitle for html output from rmarkdown. I've read many questions that address this for pdf output but none of the solutions appear to work for html.

YAML looks like this.

---
title: "for question"
subtitle: "is too far away"
author: "CAWA"
output: html_document
---
knitr::opts_chunk$set(echo = TRUE)
<style type="text/css">
h1.title {
  font-size: 38px;
  text-align: center;
}
h3.subtitle {
  font-size: 18px;
  text-align: center;
}
h4.author {
  font-size: 12px;
  text-align: center;
}

</style>

Gives:

from above code

How to simply move subtitle and author up any distance?

I can't find any code that appears to adjust this for html. Is there an argument to be added to the css? something similar to \vspace{-1cm}, which do not seem to work in this instance.

Also tried to comb through the rmarkdown documentation and either I missed this or its not there. Seems like given all the focus on customization this should be possible.


Solution

  • You could achieve your desired result by setting the margin-bottom for the title and margin-top for the subtitle, e.g. in the code below I set both to 0px:

    ---
    title: "for question"
    subtitle: "is too far away"
    author: "CAWA"
    output: html_document
    ---
    
    ```{r}
    knitr::opts_chunk$set(echo = TRUE)
    ```
    
    ```{css}
    h1.title {
      font-size: 38px;
      text-align: center;
      margin-bottom: 0px;
    }
    h3.subtitle {
      font-size: 18px;
      text-align: center;
      margin-top: 0px;
    }
    h4.author {
      font-size: 12px;
      text-align: center;
    }
    ```
    

    enter image description here