Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Using .pull-left and pull-right twice on a slide makes it misalign the columns #260

Closed
3 tasks done
ramongallego opened this issue Apr 11, 2020 · 3 comments
Closed
3 tasks done

Comments

@ramongallego
Copy link

ramongallego commented Apr 11, 2020

Hi,
I asked the same question in stackoverflow.

The issue:
Using xaringan, the first time I split content in two columns with .pull-left and .pull-right it works fine, but if I use it a second time in the same slide, then it starts the second column below the left one, and not aligned on the top

The solution I got from stackoverflow was using a different css (ninjutsu) and declare the pull-left and right parameters in the markdown with

``` {css, echo =F} 
    .pull-left {
      float: left;
      width: 44%;
    }

    .pull-right {
      float: right;
     width: 44%;
   }

   .pull-right ~ p {
    clear: both;
   }
```

In case you want to look into this, and check if there is a problem, here is a reprex

---
title: "reprex-left.right"

author: "Ramon Gallego"

date: "4/10/2020"

output:   xaringan::moon_reader
---

```{r setup, include=FALSE}
options(htmltools.dir.version = FALSE)
knitr::opts_chunk$set(warning = FALSE, message = FALSE)
```

The first time you do it works fine

.pull-left[
```{r}
y <- data.frame(A = LETTERS[1:5],
                B = 1:5,
                C = sqrt(6:10))
```


]

.pull-right[
Some text in here talking abut indexing, dataframes, accessing stuff 
]

The second time it seems to start the second column below the left column

.pull-left[
See how the right box is going down

so down.
]

.pull-right[
```{r}
y <- data.frame(A = LETTERS[1:5],
                B = 1:5,
                C = sqrt(6:10))
```

]

---

.pull-left[
See how the right box is not going down


]

.pull-right[
```{r}
y <- data.frame(A = LETTERS[1:5],
                B = 1:5,
                C = sqrt(6:10))
```

]

Here it is the session.info

R version 3.6.2 (2019-12-12)
Platform: x86_64-apple-darwin15.6.0 (64-bit)
Running under: macOS High Sierra 10.13.6, RStudio 1.2.5033

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 BH_1.72.0.3 digest_0.6.25 evaluate_0.14 glue_1.4.0
graphics_3.6.2 grDevices_3.6.2 highr_0.8 htmltools_0.4.0 httpuv_1.5.2
jsonlite_1.6.1 knitr_1.28 later_1.0.0 magrittr_1.5 markdown_1.1
methods_3.6.2 mime_0.9 promises_1.1.0 R6_2.4.1 Rcpp_1.0.4
rlang_0.4.5 rmarkdown_2.1 servr_0.16 stats_3.6.2 stringi_1.4.6
stringr_1.4.0 tinytex_0.21 tools_3.6.2 utils_3.6.2 xaringan_0.16.1
xfun_0.12 yaml_2.2.1

And a screenshot of the wrong output

Screen Shot 2020-04-10 at 5 01 05 PM


By filing an issue to this repo, I promise that

  • I have fully read the issue guide at https://yihui.org/issue/.
  • I have provided the necessary information about my issue.
    • If I'm asking a question, I have already asked it on Stack Overflow or RStudio Community, waited for at least 24 hours, and included a link to my question there.
    • If I'm filing a bug report, I have included a minimal, self-contained, and reproducible example, and have also included xfun::session_info('xaringan'). I have upgraded all my packages to their latest versions (e.g., R, RStudio, and R packages), and also tried the development version: remotes::install_github('yihui/xaringan').
    • If I have posted the same issue elsewhere, I have also mentioned it in this issue.
  • I have learned the Github Markdown syntax, and formatted my issue correctly.

I understand that my issue may be closed if I don't fulfill my promises.

@cderv
Copy link
Collaborator

cderv commented Apr 12, 2020

Thanks for the report!
In order to look at this more closely, can you format your issue better please ?
https://yihui.org/issue/#please-format-your-issue-correctly
Thank you !

@ramongallego
Copy link
Author

I think that's better now - apologies if that's not the case

@gadenbuie
Copy link
Contributor

@ramongallego I just bumped into this on my own and found your issue while checking to see if anyone else had encountered the same problem. I submitted a PR with a fix, but you can also include the following CSS in a chunk in your slides:

.pull-right ~ * { clear: unset; }
.pull-right + * { clear: both; }

@yihui yihui closed this as completed in 1b4e613 Jul 27, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants