• Resolved itzteajay

    (@itzteajay)


    So I’m interested in centering the video banner but I just can’t seem to find a way to do it… Either centering it or condensing it so you see more of the video on the screen would be great.

    I run a gaming community and we have a few first person shooter videos up and it is actually nauseating to have the reticles of to the right while watching it on the page. I think if was able to center the video or make the video less zoomed in it would help solve that problem.

Viewing 11 replies - 1 through 11 (of 11 total)
  • salsaturation

    (@salsaturation)

    Please give a link toy your site

    Thread Starter itzteajay

    (@itzteajay)

    salsaturation

    (@salsaturation)

    Are you referring to the video at the top or the one further down the page?

    salsaturation

    (@salsaturation)

    if it is tht top one – you need to go to youtube ang grab the embed code with a smaller width eg no bigger than 1170

    <iframe width="1160" height="653" src="//www.youtube.com/embed/cP_blQRyuko" frameborder="0" allowfullscreen></iframe>

    Currently you have it as 1349px

    Thread Starter itzteajay

    (@itzteajay)

    The theme does the work all it requests is the video code. I’ve been looking everywhere in the code for the right thing to change bug I can’t find it anywhere

    salsaturation

    (@salsaturation)

    Hard to control anything to do with iframe but try this in custom css

    #tubular-container iframe {
    display: block;
    top: initial !important;
    }

    also you can try this instead

    #tubular-container iframe {
    display: block;
    max-width: 1160px !important;
    top: initial !important;
    }
    Thread Starter itzteajay

    (@itzteajay)

    This works great except now I have a big black bar on top of the video. I figure that section is a fixed size as well any chance you know how to fix that?

    Thread Starter itzteajay

    (@itzteajay)

    I fixed it by modifying your code to this.

    #tubular-container iframe {
    display: block;
    margin-left: -33% !important;
    top: initial !important;
    }

    I’ve found this perfectly centers the youtube video on load up. it’s still zoomed in which I’m fine with. but now in the FPS scenes of the video the cross hair is in the middle which reduces the nausea factor.

    Thanks for all your help!

    salsaturation

    (@salsaturation)

    Try this as the -33% doesn’t work well on large screens

    #tubular-container iframe {
    display: block;
    top: initial !important;
    max-width: 1140px;
    max-height: 641px;
    }
    Thread Starter itzteajay

    (@itzteajay)

    I’ve tried that as well and the issue with that is having a big grey empty space below the video… I like it this way besides that grey box… if it’s possible to push the rest of the page up to fill that space and move the play pause and sound buttons up over the video again that would 100% solve the problem for me.

    salsaturation

    (@salsaturation)

    Actually part of the video is hidden. Try this

    #tubular-container {
    height: 760px !important;
    }
    
    .onetone-Home.video-section {
    height: 640px !important;
    }
Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘Centering Youtube Videos’ is closed to new replies.