title: How to adjust div containing plotly to plot dimensions so it does not overlap document
body: <p>I am using plotly to produce a plot in RMarkdown.
  However, as it is embedded in a div, it overlaps with the following text.
  I think it's because of a conflict between the plotly size and div.</p>
  <pre><code>  ---
      title: &quot;TITLE&quot;
      author: &quot;AUTHOR&quot;
      date: &quot;1/1/2000&quot;
      output:
        html_document
      ---
      
      ```{r setup, include=FALSE}
      knitr::opts_chunk$set(
        warning = FALSE,
        message = FALSE,
        echo = FALSE  # show R code
      )
      
      ```
      ## scatter 1
      
      ```{r, echo=FALSE, eval=TRUE,out.width=&quot;100%&quot;,out.height=&quot;100%&quot;,fig.align='center'}
      library(plotly)
      library(htmltools)
      mtcars$am[which(mtcars$am == 0)] &lt;- 'Automatic'
      mtcars$am[which(mtcars$am == 1)] &lt;- 'Manual'
      mtcars$am &lt;- as.factor(mtcars$am)
      
      fig &lt;- plot_ly(mtcars, x = ~wt, y = ~hp, z = ~qsec, color = ~am, colors = c('#BF382A', '#0C4B8E'))
      fig &lt;- fig %&gt;% add_markers()
      fig &lt;- fig %&gt;% layout(scene = list(xaxis = list(title = 'Weight'),
                           yaxis = list(title = 'Gross horsepower'),
                           zaxis = list(title = '1/4 mile time')))
      
      
      fig %&gt;% layout(autosize = F, width = 1000, height = 800,paper_bgcolor = 'rgb(243, 243, 243)', margin = list(r = 10,t = 25,b = 40,l = 110)) -&gt; p
      
      div(p,align='center')
      ```
  # HEADING
      
  asdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasdasdas asdasdasdasda
  </code></pre>
  <p><a href="https://i.stack.imgur.com/7QMWn.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/7QMWn.png" alt="enter image description here" /></a></p>
  <p>As you see the text is hidden. How to tweak the div properties to make it visible?</p>