how to get responsive video to always be centered

The div with id="largeVideo" should be moved out of the div with id="homebanner" and into the div with id="hometext".

Then add float:right; to that div:

div#largeVideo {
    float: right;
}

Select allOpen in new window

Actually, to get the text to wrap around the left of the video, move the video div before the text that should go to the left of it. eg move the div with id="largeVideo" just before the line:

<h2>Ask Our Nurse</h2>

Select allOpen in new window

Screenshot of that last change, with the float:right; style added:

For smaller screen sizes you could use a media query to style the video div to have float:none; so that the text no longer wraps around it.

Terry, is it too much to ask for a set of media queries that would let this be responsively compatible on all tablets and devices. So that mobile/tablet doesn't break. It's fine now.

If that's too much just give me some references to learn.

Thanks,

Bob

What I mean is for the video to take up 100% of the screen width on a mobile phone and an appropriate amount on a tablet.

I'm happy to provide a media query if you'll make the changes suggested above; were you intending to do that? If not, it's going to be much more difficult, so may or may not be able to do what you want.

That's all I need is a media query. Give me a day to make the changes.

I can't remember if the site's using jQuery, but it's worth mentioning that jQuery can be used to change an elements position in the page reasonably easily if it's hard to change the other code that generates the page.

javascript is not allowed on this site except what is already there. Thanks though.

So, to be clear, are you going to move the video div before the text that should go to the left of it. eg move the div with id="largeVideo" just before the line:

<h2>Ask Our Nurse</h2>

Select allOpen in new window

or were you expecting just a media query by itself to display the video lower down the page? I think the div needs to be moved too, but I'm not sure whether you're planning to do that

No, I moved it there and the video moved way down the page. I think I'm ready for a media query, I can move things temporarily if you need. Check it out:

www.idiaper.com

Ok, I'm not clear on where you want the video. Which text do you want it to appear before or after?

I think I got it, but the bottom of the video is cut off on all mobile devices. What can I do about that?