Skip to content

Added max-width to videos to prevent them escaping the page content area #4204

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

Merged
merged 3 commits into from
Apr 27, 2023

Conversation

snowc0de
Copy link
Contributor

This is to prevent that videos included in pages don't exceed the page border. This is to avoid the following issue:
image

Which now becomes this:

image

I didn't build the project and only added the CSS code into my instance's "head config" but as far as I know this fix should work.

This is to prevent that videos included in pages don't exceed the page border
@ssddanbrown
Copy link
Member

Thanks for offering. Setting a width could cause further issues though (videos with pre-defined sizes, videos smaller than the page width). Instead, a max-width may be a better approach, within our page content style block so its clear this rule relates to video in page content (Rather than in the CSS reset).

@snowc0de
Copy link
Contributor Author

Thanks for the feedback @ssddanbrown, I just made the change :)

@ssddanbrown
Copy link
Member

Thanks for updating @chopin2712. Will merge for next release.


Weakly related to #1760

@ssddanbrown ssddanbrown merged commit a9d9525 into BookStackApp:development Apr 27, 2023
@ssddanbrown ssddanbrown changed the title Adding a video { width: 100%; } Added max-width to videos to prevent them escaping the page content area Apr 27, 2023
@JNR8
Copy link

JNR8 commented Jun 18, 2024

Did this get implemented? My videos till break page width on mobile devices.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Development

Successfully merging this pull request may close these issues.

3 participants