-
Notifications
You must be signed in to change notification settings - Fork 351
video shortcode, when in revealjs column, does not respect % dimensions #6296
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
Comments
Thanks for the report. You're running a slightly older version of quarto:
Can you install the latest version and confirm that the problem persists? |
Unfortunately, I can't quickly install the latest version on the device used for reporting above; it's a corporate device. But I have a recent version of Quarto (1.3.340) on another device and can reproduce the problem there. (Separately, likely because I'm a Linux newb, I couldn't uninstall old/install new version of Quarto with dpkg or gdebi) EnvironmentsEnvironment 1:
Environment 2:
Quarto check
Result |
From the example, I am not entirely sure what's not working exactly. |
Sorry for the long and confusing initial post. When local videos are included in a multi-column layout, they seem to grow to fill their column container. If one writes something like the code below... # My slide
:::: {.columns}
::: {.column width="70%"}

:::
::: {.column width="30%"}
Video grows to fill its container, subject to size of container and intrinsic dimensions of the video..
:::
::::
...then the video basically grows to fill its column container. Here's an example: ![]() If useful, here's the slide, and here the source code. I expect that videos sourced from, say, YouTube and included via the video shortcode should be displayed in the same way (i.e., automagically grow to fill its container). Unfortunately, videos sourced with the video shortcode appear to display differently. While they grow to fill the width of their container, they don't grow to fill their height. When one provides height and width as percentages, they still don't grow to fill their container (according to those percentages). # `video` in column
## Without dimensions
:::: {.columns}
::: {.column width="70%"}
{{< video https://www.youtube.com/embed/yvi5uXQMvu4 >}}
:::
::: {.column width="30%"}
Without dimensions specified, the video appears quite small--perhaps the size of its YouTube thumbnail (?)
:::
::::
## With dimensions = 100%
:::: {.columns}
::: {.column width="70%"}
{{< video https://www.youtube.com/embed/yvi5uXQMvu4 width="100%" height="100%" >}}
:::
::: {.column width="30%"}
When instructed to occupy 100% of the width and heigth of its container, the video only obeys on the width dimension. The height is too short.
:::
::::
## With dimensions < 100%
:::: {.columns}
::: {.column width="70%"}
{{< video https://www.youtube.com/embed/yvi5uXQMvu4 width="100%" height="85%" >}}
:::
::: {.column width="30%"}
Similar problem as above
:::
::::
It's only when one provides pixel dimensions manually that the video can be coerced to fill its container in the same way that a local image does automatically. ## Shortcode, dimensions in px
:::: {.columns}
::: {.column width="70%"}
{{< video https://www.youtube.com/embed/yvi5uXQMvu4 width="760" height="515" >}}
:::
::: {.column width="30%"}
The video finally grows to desired dimensions. Unfortunately, this requires the user to specify dimensions in pixels.
:::
::::
|
Thanks for this - This is exactly the workaround I was looking for until it's fixed in some future version. |
This bug is still present in 1.7.29. The basic example code on the quarto video documentation. Similar issues occur with local files. I'm using the workaround to specify it in pixels. Absent any width/height settings, video overflows the bottom of the slide.
creates a wide short video: |
@astrowonk As you can see, the issue is still opened, thus not fixed. Please also properly format your message using proper markdown syntax, for instance use backticks for inline code or code block (there are buttons in the GitHub UI to help with that). |
Note that by replying to my reply, you also trigger notifications for all participants. Notifications can be altered in github settings if you do not wish to receive emails, etc. The point is that the issue is not fixed & the example in the documentation does not work. Nitpicking comments or issues does not encourage participation. |
You are completely missing the point.
There are almost 1,500 opened issues. Commenting that those are not fixed does not help fix them. It cost you time to write the comments and cost time to maintainers to read/triage them. GitHub has a reaction feature which allows users to add reactions to an issue such as thumb up. This is more useful to maintainers because issues can be sorted by the number of reactions thus maintainers can use that as a proxy of the interest on the bug fix or enhancement to eventually prioritise. |
@astrowonk We do prefer that you upvote instead of commenting. It really is a matter of improving signal-to-noise for us. We appreciate the understanding. |
Bug description
According to the documentation, video shortcodes in revealjs should produce videos that respect the height and width specified as %. While shortcodes work as expected when videos occupy the full body of a slide, they do not when videos are placed in columns--unless video dimensions are specified in pixels.
While far from an HTML/CSS expert, I suspect that the issue might lie with the HTML/CSS being written by Quarto--potentially with the column class applied to revealjs columns.
This behavior does not arise when local video files are provided via Markdown syntax (e.g.,

. They simply grow/shrink the space available in revealjs columns.Steps to reproduce
Expected behavior
Video shortcode should produce a video that respects width and height dimensions specified in %.
Actual behavior
Video shortcodes respect width but not height when those dimensions are specified in %.
Your environment
I've also replicated this in other environments (e.g., RStudio as IDE, Pop_OS! as OS, etc.)
Quarto check output
The text was updated successfully, but these errors were encountered: