0

I am trying to insert a horizontal line (---) right after this header below, but the line is being placed in the wrong position, invading the header area. It began happening when I added float configs in the css. Any sugestions of what is happening?

---
title: "report"
author: "who cares"
date: "`r format(Sys.time(), '%d, %B, %Y')`"
output: html_notebook
---

<style type="text/css">

h1.title {
  font-size: 38px;
  color: DarkBlack;
  text-align: left;
}
h4.date { /* Header 4 - and the author and data headers use this too  */
  font-size: 18px;
  font-family: "Times New Roman", Times, serif;
  color: DarkBlack;
  float: right;
}

h4.author { /* Header 4 - and the author and data headers use this too  */
    font-size: 18px;
  font-family: "Times New Roman", Times, serif;
  color: DarkBlack;
  float: left;
}
</style>

---
daniellga
  • 1,142
  • 6
  • 16

1 Answers1

1

It's a css issue with the floating element.

Just add a clearfix to the containing header div like such:

<style>
  [...]
  div#header {
    overflow: auto;
  }
</style>

(see here for more details)

UPDATE:
as requested by OP, the full code would be

---
title: "report"
author: "who cares"
date: "`r format(Sys.time(), '%d, %B, %Y')`"
output: html_notebook
---

<style type="text/css">

h1.title {
  font-size: 38px;
  color: DarkBlack;
  text-align: left;
}

h4.date { /* Header 4 - and the author and data headers use this too  */
  font-size: 18px;
  font-family: "Times New Roman", Times, serif;
  color: DarkBlack;
  float: right;
}

h4.author { /* Header 4 - and the author and data headers use this too  */
  font-size: 18px;
  font-family: "Times New Roman", Times, serif;
  color: DarkBlack;
  float: left;
}

div#header {
  overflow: auto;
}
</style>

---
alex_jwb90
  • 1,663
  • 1
  • 11
  • 20
  • Could you add the suggestion you made to my code? I tried doing it or even doing what the link u sent tells, but didn't make it work... – daniellga Jul 09 '20 at 00:36
  • 1
    it's really just one more css instruction in your existing ` – alex_jwb90 Jul 09 '20 at 00:42
  • Thank you! I was trying to put it inside the author and date elements. – daniellga Jul 09 '20 at 00:46