blogdown not autoscaling images - they get cut off midway when viewed on iOS

Question

---
title: "Title"
date: 2019-01-01
categories: ["TBD"]
tags: ["TBD"]
---

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

## Including Plots

You can also embed plots, for example:

```{r pressure, echo=FALSE}
plot(pressure)
```

Note that the `echo = FALSE` parameter was added to the code chunk to prevent printing of the R code that generated the plot.

---

[EDIT] I put this at the beginning of all my *.Rmd docs and the issue is solved:

```{r setup, include=FALSE}
knitr::opts_chunk$set(collapse = TRUE, out.width = "100%")
```

---

I'm running the code chunk above on my blogdown site hosted via Netlify. When I view it on my desktop browsers everything looks fine. When I view it on my iPhone the plots don't autoscale and get cut off.

Image #1 below is my iPhone in portrait mode. If I rotate my iPhone to landscape mode (Image #2) I get some more horizontal resolution and the whole width of the graph is viewable.

Is there a way to get blogdown to autoscale the images so they'll work no matter the resolution of the browser in question. I have tested on iOS Safari/Chrome/Firefox and all browsers have the issue.

I also have already performed Yihui rule #1 and updated all my packages prior to asking this question via update.packages(ask = FALSE, checkBuilt = TRUE) and tinytex::tlmgr_update() .

---

Image 1 - iPhone Portrait Mode

---

Image 2 - iPhone Landscape Mode

---

Answer 1

By default, the size of the plot has a fixed width in pixels. You can specify out.width = "90%" in the knitr options for a responsive size.
However, even in pixels, I do not face this problem on small screens. Then, I think this may be related to the theme you used. Not sure though.