As per this answer and other resources, my understanding is the when setting up CSS for an Rmarkdown presentation, code.r{} should control the parameters for echoed code, while pre{} should control the size of the output. However, pre{} seems to be changing both and code.r{} is doing nothing. Am I doing something wrong?
---
title: "CSStest"
author: "Me"
date: "December 27, 2017"
output: ioslides_presentation
---
<style type="text/css">
body{ /* Normal */
font-size: 16px;
}
code.r{ /* Code block */
font-size: 4px;
}
pre {
font-size: 42px
}
</style>
```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = FALSE)
```
---
### Slide with R Output
```{r echo = TRUE}
##here is some R code
1+3
##Why is the output the same size as the code?
```
I am using Pandoc 2.0.5, rmarkdown_1.8.5, and knitr_1.15.1 on Windows.
Edit: This is the html for the slide I screencapped:
<slide class=""><hgroup><h2></h2></hgroup><article >
<h3>Slide with R Output</h3>
<pre class = 'prettyprint lang-r'>##here is some R code
1+3</pre>
<pre >## [1] 4</pre>
<pre class = 'prettyprint lang-r'>##Why is the output the same size as the code?</pre></article></slide>
<slide class="backdrop"></slide>
</slides>
I also tried a slightly different approach to customize my slides on a per-slide basis, described in this thread.
---
title: "CSStest"
author: "Me"
date: "December 27, 2017"
output: ioslides_presentation
---
Presentation Title
========================================================
author: Jane Doe
transition: none
<style>
.small-code pre code {
font-size: 1em;
}
</style>
Slide 1 - large code
========================================================
Regular slide text here
```{r}
head(cars)
```
Slide 2 - small code
========================================================
class: small-code
More regular slide text...
```{r}
head(cars)
```
but again, no change in font size
update: I realized that there was a newer version of Knitr, but with knitr_1.17 I am experiencing the same problem.