Horizontally scrollable output on xaringan slides - css

Question

I'd like to have the output of an R command shown in a horizontally scrolling box. Reprex:
library(ggplot2movies)
head(movies)
# title year length budget rating votes r1 r2 r3 r4 r5 r6 r7 r8 r9 r10 mpaa Action Animation Comedy Drama Documentary Romance Short
# 1 $ 1971 121 NA 6.4 348 4.5 4.5 4.5 4.5 14.5 24.5 24.5 14.5 4.5 4.5 0 0 1 1 0 0 0
# 2 $1000 a Touchdown 1939 71 NA 6.0 20 0.0 14.5 4.5 24.5 14.5 14.5 14.5 4.5 4.5 14.5 0 0 1 0 0 0 0
# 3 $21 a Day Once a Month 1941 7 NA 8.2 5 0.0 0.0 0.0 0.0 0.0 24.5 0.0 44.5 24.5 24.5 0 1 0 0 0 0 1
# 4 $40,000 1996 70 NA 8.2 6 14.5 0.0 0.0 0.0 0.0 0.0 0.0 0.0 34.5 45.5 0 0 1 0 0 0 0
# 5 $50,000 Climax Show, The 1975 71 NA 3.4 17 24.5 4.5 0.0 14.5 14.5 4.5 0.0 0.0 0.0 24.5 0 0 0 0 0 0 0
# 6 $pent 2000 91 NA 4.3 45 4.5 4.5 4.5 14.5 14.5 14.5 4.5 4.5 14.5 14.5 0 0 0 1 0 0 0
How do I make the output horizontally scrollable on a xaringan slide?

Answer 1

#Yihui Xie has pretty much provided the answer on Github. I'm just making it into a working example here. Things to note are:
1) One can specify css as code chunks in Rmarkdown, or one can write his or her own css file following these guidelines: https://github.com/yihui/xaringan/wiki. I'm assuming this is a one-off thing so for simplicity I'm including the css in the Rmd file.
2) After setting attributes for the pre element, one also need to set the width option or R to a large value, otherwise head will wrap the output for you.
---
title: "Horizontal scroll for wide output"
output:
xaringan::moon_reader:
css: ["default"]
nature:
highlightLines: true
---
```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = TRUE)
```
```{css, echo=FALSE}
pre {
background: #FFBB33;
max-width: 100%;
overflow-x: scroll;
}
```
```{r}
library(ggplot2movies)
op <- options("width"=250) # large number to trick head, otherwise see next slide
head(movies)
options(op) # set options back to default
```
---
```{r}
head(movies) # head with default width, note text gets wrapped. Though you can still scroll horizontally, as an effect of setting `pre`
```