How do I remove the border around this image in Bookdown?

Question

I am writing a technical report in Bookdown to be output to html format. I have inserted an image on the cover page and wish to remove the border. See image here:

The code to insert the image is here:

```{r, fig.align='center', echo=FALSE}
knitr::include_graphics('./images/Solar panel.jpg')
```

I also inserted this code in the style.css script:

img {
  border: none;
  box-shadow: none;
}

For reference, here is the _output.yml script:

bookdown::bs4_book:
  css: style.css
  theme:
    primary: "#231EDC"
    secondary: "#D2D1F8"
    border-width: "0px"
    border-color: "#FFFFFF"
    blockquote-border-color: "#FFFFFF"

Unfortunately, the border is still visible. Does anyone know how I can remove the border, or at least hide it.

Answer 1

Removing the border property for inline-figure class will solve your case.

So simply add this code to your style.css file

style.css

.inline-figure {
  border: none !important;
}