0

I would like to create an HTML document from R Markdown as an ioslides_presentation. I would like to use the kable_styling bootstrap_options on tables and produce a presentation that is in widescreen mode by default.

I can either produce a document with tables that render as expected with kable_styling(bootstrap_options = c("striped", "hover")):

---
title: "ioslides_and_kable_styling"
output:
  ioslides_presentation
---

```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = FALSE)
```

```{r, message=FALSE}
library(dplyr)
library(kableExtra)
```

## My title

```{r results='asis'}
data <- tibble(Column1 = c("A", "B"), Column2 = c(1, 2))
data %>% knitr::kable(format = "html", caption = "My table") %>% 
    kable_styling(position = "right", bootstrap_options = c("striped", "hover"))
```

Slide with bootstrap_options

Or I can produce a document that is by default in widescreen mode, in which the bootstrap_options are "ignored":

---
title: "ioslides_and_kable_styling"
output:
  ioslides_presentation:
    widescreen: true
---

```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = FALSE)
```

```{r, message=FALSE}
library(dplyr)
library(kableExtra)
```

## My title

```{r results='asis'}
data <- tibble(Column1 = c("A", "B"), Column2 = c(1, 2))
data %>% knitr::kable(format = "html", caption = "My table") %>% 
    kable_styling(position = "right", bootstrap_options = c("striped", "hover"))
```

Widescreen slide

Is there someway to have both?

Brett Koblinger
  • 451
  • 4
  • 4
  • Generally speaking all such styling is done by CSS code. It appears that the CSS code for the bootstrap options is conflicting with the CSS code for the ioslides style. These kinds of conflicts are hard to fix, but the general strategy is to right click on the thing that changes, and examine what your browser says in the "Styles" pane, and see how it changes from when it works to when it doesn't. – user2554330 Jan 13 '21 at 14:13
  • Thanks for the reply, @user2554330. Even if I examine the changes in "Styles," do you know how I could make a change in the R markdown document? – Brett Koblinger Jan 27 '21 at 07:04
  • You need to insert new CSS that overrides the bad CSS entry. CSS rules are complicated, but the general idea is that a more specific rule overrides a more general one. Put this code in a `.css` file, and include it using the `css` option to `ioslides_presentation` in the YAML. – user2554330 Jan 27 '21 at 10:06

0 Answers0