WordPress.org

Ready to get started?Download WordPress

Forums

Viper's Video Quicktags
FLV video gets squished or cut off (4 posts)

  1. stresshacker
    Member
    Posted 4 years ago #

    Hello, thanks for the great plugin. On our church site, under construction, the .flv video displays squished on IE8 (to 250px wide) and cut in half (to 260px wide) on Chrome. Here's the link to the page:

    http://www.weblifechurch.com/pastor/worship/

    The settings are for default format.

    Any help will be greatly appreciated.

  2. Alex Mills (Viper007Bond)
    Moderator
    Plugin Author

    Posted 4 years ago #

    My plugin adds some CSS that tells the browser to make the video no wider than the containing object it's in (to avoid overflowing into sidebars and whatnot). In this case, one of the parent div's has the class headway-leaf which has a width of 250 pixels, so the browser resizes it from 400 pixels wide to only 250 pixels wide.

    The solution is to make the container wider so that a wider video can fit inside of it.

  3. stresshacker
    Member
    Posted 4 years ago #

    Can you please tell me where you see the width of the div as being 250? I have it set for 400px. I looked at the page source code but could not find a specified width for the div headway-leaf. Thanks!

  4. Alex Mills (Viper007Bond)
    Moderator
    Plugin Author

    Posted 4 years ago #

    You have the video width set to 400, but that is being ignored since the container's width is only 250 pixels.

    Here's the HTML in question: http://wordpress.pastebin.com/6bGqCHPY (I added the second highlighted line to point to the specific div and CSS class)

    You then have this CSS in your stylesheet:

    .headway-leaf {
        float: left;
        width: 250px;
        margin: 5px;
        padding: 10px 10px 0;
        overflow: hidden;
        min-height: 110px; }

    That leaves you with a narrow column for your content.

    It's likely cut in half in Chrome because Chrome is ignoring the CSS saying don't make the video wider than the container so it makes it the full 400 pixels wide. However the container also has overflow: hidden; meaning any content that overflows outside of the container gets hidden (i.e. the right side of the video).

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic