How to write code to change width/height of video-CodePudding

How should I write html/CSS code to change width/height of video(mp4)? Here are my code.

---html---

    <link rel=”stylesheet” href=../../css/videos.css> ←this path is correct        
    
    <table width="550" height="489" border="0" cellpadding="0" cellspacing="0">
          <tr>
            <td width="10"><img src="../../images/some/something.gif" width="10" height="489"></td>
            <td>
                <video controls autoplay loop muted >
                  <source src="something.mp4" type="video/mp4">
                </video>
            </td>
          </tr>


---videos.css---

.videos {
    width: 450px;
    height: 450px;
}

In this code, width/height of the video didn't change. Can anyone help please? Thank you.

CodePudding user response：

your code seems correct. check this link. it is better not to set the height of your video.

        .videos {
    width: 450px;
}
table {
  border-spacing: 0;
  border-collapse: collapse;
}

CodePudding user response：

Your Code is correct. Check the code if you need to use height and object-fit: cover; Property.

.videos {
    width: 450px;
    height: 450px;
    object-fit: cover;
}

<table width="550" height="489" border="0" cellpadding="0" cellspacing="0">
     <tr>
       <td width="10"><img src="https://images.unsplash.com/photo-1432958576632-8a39f6b97dc7?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=400&fit=max&ixid=eyJhcHBfaWQiOjE0NTg5fQ&s=6ecedc1e639d8a4b77aa8e85f4962f03" width="10" height="489"></td>
       <td>

         <video  controls autoplay loop muted>
           <source src="https://mdbootstrap.com/img/video/Crossroad.mp4" type="video/mp4">
         </video>

       </td>
     </tr>
   </table>