Rommdown ioslides change table headers
I am trying to create a custom table format for tables created using the iOSlides_presentation Rmarkdown output type with Rstudio version 0.98.1028. Unfortunately, I cannot change the format of the table headers.
This is the rmd file:
---
title: "I can't change table headers with css"
author: "Blah Blah"
date: "August 27, 2014"
output: ioslides_presentation
css: slidetheme.css
---
## Ugly table
A B C
--------- -------- --------
1 2 4
2 3 5
My css file:
td, th {
width: 4rem;
height: 2rem;
border: 1px solid #ccc;
text-align: center;
}
td, tr {background:white; background-color:white; color: black;}
th {
background: black;
border-color: white;
}
body {
padding: 1rem;
}
The table sections are responsive to css changes, but the title does not change. I've been back and forth with this, but can't figure out what's going on. Does anyone know how to do this?
Thanks in advance, Miguel
source to share
There are three things you need to do:
First, change the YAML header so that CSS is listed as a format property ioslides_presentation
, for example:
output_format:
ioslides_presentation:
css: slidetheme.css
Second, the most specific rule wins in CSS, and the ioslides CSS (which you don't want to remove) has some pretty specific rules for style sheets. If you want to override them, you will need to make your rules even more specific, or mark them with !important
. The easiest way is to use the web inspector to see which rule wins, so you can adjust accordingly - click "Open in browser" after rendering, then right click β Inspect Element (Chrome).
Finally, since your CSS is merged, you need to do more than just add your own styling, you also need to clear any CSS properties set by ioslides that you don't want to apply.
source to share