Adding a video removes everything underneath it

<%= @topic_view.topic.title %>
<%= @topic_view.topic.average_rating %> <%= @topic_view.topic.posts.count { |p| !!p.custom_fields['rating'] } %>

When I added a video to my website it removes everything underneath it when I load my webpage (which is 75% of the content). I do not understand why this is happening. Any help is appreciated, thanks in advance.

#videoFrame{
  width:100%:
}

#videoFrame iframe{
   margin: 0 auto;
   display: block;
   width: 560px;
}


<dev id="videoFrame">
  <iframe width="560" height="315" 
    src="C:\Users\reliv\.atom\Website\William_VS_Lab_Playing_Fetch.mp4" type="video/mp4"
    alt="Dog running from a kid with a frisbee in her mouth">
</dev>

You haven’t given us enough to go on. Post a live version of the page (like on Codepen) or use GitHub to upload the code and post a link.

I assume <dev> is just a typo in the code you have posted?

Since <dev> isn’t an element it will be ignored and so will #videoFrame styles.

I don’t see how that would remove everything underneath it. Also, I guessing it’s just a typo for the code posted, but I might be wrong.

Don’t think it would. Just saying. FYI

I tried <video></video> also, did the same thing. I found a fix by doing

<video id=William_VS_Lab_Playing_Fetch width="1000" height="500" controls>
    <source src="C:\Users\reliv\.atom\Website\William_VS_Lab_Playing_Fetch.mp4" type="mp4">
    <source src="C:\Users\reliv\.atom\Website\William_VS_Lab_Playing_Fetch.mp4" type="video/ogg">
    alt="Dog running from a kid with a frisbee in her mouth">
</video>

I don’t understand why the other code format deletes everything underneath it though.

Also, can I host my site on something like GitHub and see how it works online before I launch it on my webhost server? Would love to make sure it works flawlessly before I launch.

You can use GitHub Pages.

Again, without seeing all the code we can’t really help answer your question about what the problem was.

Are you adding the video to the css? Also you need to put an iframe closing tag.

Wow, I am going to laugh so hard if that was my problem all along LOL. -Face Palm-

Ok, I created a github account. This is the version that does not work for my website. I found a working code as listed above, was just curious why this one threw everything off. This is my first website and I am not finished editing or CSS’ing it yet, just getting it put out there and applying what I learned from the FCC curriculum, go easy on me :slight_smile:.

Thanks in advance!

https://weiszguy55.github.io/WeiszStorage.github.io/