WordPress responsive video center

  • Hi everyone, I’m really new to this. I’m having a problem centering a video I am hosting on WP. I’ve added responsive CSS so that when viewed on mobile… the video adjusts to the screen size. This works perfectly. But when viewed on desktop… the video is aligned to the left. How can I center this video so, when viewed on desktop, it appears in the centre. The HTML and CSS are below:

    HTML< div>

    [video style="text-align:center" width="640" height="360" mp4="http://rocknrollenglish.com/wp-content/uploads/2018/02/RnRFVThankyou.mp4"][/video]

    < /div>

    < style>

    .video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    }

    .video-container iframe,
    .video-container object,
    .video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    }

    .entry-content img,
    .entry-content iframe,
    .entry-content object,
    .entry-content embed {
    max-width: 100%;
    }
    < /style>

  • Hi @danielpgandolfi, it looks like you are using WordPress but you are not hosted here at WordPress.com. These forum are for those hosted here at WordPress.com. For self-hosted WordPress sites such as yours, I would suggest asking for help in the volunteer-based WordPress.org forums.

    The differences between WordPress.com and WordPress.org.

    I would have taken a quick look to see if I could get you started, but you did not provide a link to the site.

  • The topic ‘WordPress responsive video center’ is closed to new replies.