Main content pushed to the 2nd page if the sidebar is longer than one page

[tungttnguyen]

Hello,

I tested this commit and when I opened the html file on

• Windows 10 Chrome 70.0.3538.110 (Official Build) (64-bit) Nothing showed up, just a blank page. Inspect > Errors

paged.js:23454 Fetch API cannot load file:///D:/pagedown/pagedown_example_files/paged-0.0.20/css/resume.css. URL scheme must be "http" or "https" for CORS request.
add @ paged.js:23454
paged.js:23454 Uncaught (in promise) TypeError: Failed to fetch
    at Polisher.add (paged.js:23454)
    at Previewer.preview (paged.js:26428)
    at paged.js:26494

• Firefox Quantum 63.0.3 (64-bit)

Rmd code

``` --- title: "Lijia Yu's resume" author: Lijia Yu date: "`r Sys.Date()`" output: pagedown::html_resume: self_contained: false --- Aside ================================================================================ {width=80%} ## Contact Info {#contact} - [lijia.yu@outlook.com](mailto:lijia.yu@outlook.com) - [](https://github.com/yulijia) | [](https://github.com/) | [](https://github.com/) | [](https://github.com/) - (+1) 123-456-7890 - For more information, please contact me via email. ## Skills {#skills} - Experienced in statistical analysis, statistical learning models, and optimization methods. - Full experience with next generation sequencing data analysis. - Highly skilled in R, Bash, Perl, Python, LaTeX - Experienced in statistical analysis, statistical learning models, and optimization methods. - Full experience with next generation sequencing data analysis. - Highly skilled in R, Bash, Perl, Python, LaTeX - Experienced in statistical analysis, statistical learning models, and optimization methods. - Full experience with next generation sequencing data analysis. - Highly skilled in R, Bash, Perl, Python, LaTeX ## Disclaimer {#disclaimer} This resume was made with the R package [**pagedown**](https://github.com/rstudio/pagedown). Last updated on `r Sys.Date()`. Main ================================================================================ ## Lijia Yu {#title} ### Currently searching for a PhD student position Please note that this is a *real* resume, and I'm really looking for a PhD student position at the moment. I made this resume because Yihui asked me if I'd like to test the **pagedown** package with my resume. If you are interested in my background and skills, please feel free to contact me. ## Education {data-icon=graduation-cap data-concise=true} ### Beijing University of Chemical Technology B.S. in Information and Computing Sciences Beijing, China 2010 Thesis: Dyadic wavelet and its application in edge detection ### University of Chinese Academy of Sciences M.S. in Bioinformatics Beijing, China 2014 Thesis: A multi-omics study for intra-individual divergence of the distributions between mRNA isoforms in mammals ```

[yihui]

You need to wait for our documentation, which is what I'm working on this week.

In this case, you need a web server to preview the page. There are many possible to start a web server. The easiest one may be xaringan::inf_mr().

[yihui]

I forgot to mention that xaringan::inf_mr() will only fix the page.js error. If the sidebar is too long, the problem is probably inevitable (I'm not sure; this needs investigation). The sidebar is just a sidebar. Practically, you probably should not stuff it with too much content.

[yihui]

Now it is possible to add side notes on later pages using the syntax ::: aside, e.g.

Selected Publications and Posters {data-icon=file}
--------------------------------------------------------------------------------

### Genetic and epigenetic signals are found predictive to the distribution of intra-individual divergence of alternative splicing.

Poster for 2013 International Conference of Genomics

Qingdao, China

2014

**Yu L**, Chen B, Zhang Z.

::: aside
Some notes in the sidebar.
:::

[RLesur]

If the sidebar is too long, the problem is probably inevitable (I'm not sure; this needs investigation). The sidebar is just a sidebar. Practically, you probably should not stuff it with too much content.

You're right: it is inevitable with floating elements. The logic of paged.js is the following: if an element overflows on another page, the chunker will detect it and create a new page. Here, the first element (#aside), that is floating right, overflows: the chunker creates a new page, position the remaining content in the new page and take the following element (#main). This also explains why you needed to switch #main and #aside in https://github.com/rstudio/pagedown/commit/71631aa30c55cd2b61b3ac34063252b373e557eb We only can use floating elements that have a height smaller than the page content height.

[tungttnguyen]

Thank you both!