rstudio / blogdown

Create Blogs and Websites with R Markdown
https://pkgs.rstudio.com/blogdown/
1.73k stars 334 forks source link

pic start in the next line #732

Closed tianfeiwei closed 2 years ago

tianfeiwei commented 2 years ago

Dear Yihui, I was trying to convert some of my regular rmarkdown files to blowdown rmd posts, but the insert image always move to a new line. Here is the example code:

With following rmarkdown code in blowdown post:

### What's the relationship between R ![](https://upload.wikimedia.org/wikipedia/commons/thumb/1/1b/R_logo.svg/512px-R_logo.svg.png){width=25px} and R Studio ![](http://dms.umontreal.ca/wiki/images/thumb/e/e9/RStudio-Ball.png/300px-RStudio-Ball.png){width=25px}?

I should get similar html layout as regular rmarkdown output:

image

but what I got is like this in blowdown html output:

image

Is this a bug or just how blowdown post looks like?

Checklist

When filing a bug report, please check the boxes below to confirm that you have provided us with the information we need. Have you:

Locale: en_US.UTF-8 / en_US.UTF-8 / en_US.UTF-8 / C / en_US.UTF-8 / en_US.UTF-8

Package version: base64enc_0.1.3 blogdown_1.12.4 bookdown_0.29 bslib_0.4.0 cachem_1.0.6 digest_0.6.29 evaluate_0.16 fastmap_1.1.0 fs_1.5.2
glue_1.6.2 graphics_4.2.1 grDevices_4.2.1 highr_0.9 htmltools_0.5.3 httpuv_1.6.6 jquerylib_0.1.4 jsonlite_1.8.0 knitr_1.40
later_1.3.0 magrittr_2.0.3 memoise_2.0.1 methods_4.2.1 mime_0.12 promises_1.2.0.1 R6_2.5.1 rappdirs_0.3.3 Rcpp_1.0.9
rlang_1.0.5 rmarkdown_2.16 sass_0.4.2 servr_0.24 stats_4.2.1 stringi_1.7.8 stringr_1.4.1 tinytex_0.41 tools_4.2.1
utils_4.2.1 xfun_0.33 yaml_2.3.5

Hugo version: 0.103.1



- [x] upgraded all your packages to their latest versions (including your versions of R, the RStudio IDE, and relevant R packages)?

- [x] installed and tested your bug with the development version of the blogdown package using `remotes::install_github('rstudio/blogdown')` ?
cderv commented 2 years ago

Which theme are you using ? With blogdown, any layout behavior can be due to Hugo theme choice and not blogdown

It probably comes from there as it could have a specific CSS rules that does not handle inline image (by adding display: block on all image maybe)

Using default html_document format in rmarkdown, there is no issue

---
title: "Untitled"
output: html_document
---

### What's the relationship between R ![](https://upload.wikimedia.org/wikipedia/commons/thumb/1/1b/R_logo.svg/512px-R_logo.svg.png){width=25px} and R Studio ![](http://dms.umontreal.ca/wiki/images/thumb/e/e9/RStudio-Ball.png/300px-RStudio-Ball.png){width=25px}?

image

So it is just probably a CSS issue and you need to correctly tweak the rule so that it displays inline.

Can you check that ?

tianfeiwei commented 2 years ago

Can you check that ?

Hi Christophe, thanks you very much for your quick reply. The wowchemy academic theme uses display: block as default, I just changed it to display: inline-block and everything's back to normal (same as our original rmarkdown output).

image

Thank you very much for your help and it's fantastic to change the inline pic back.