<video>和<audio>元素不会居中

Question

我已经在网页上添加了视频和音频文件，但是它们似乎并不想居中。

HTML代码是：

<h2>Dedicated to Quality</h2>

<video height="210" class="center" controls="controls" poster="aboutus/poster.jpg">
<source src="aboutus/ucorp.mp4" type="video/mp4"/>
Your browser does not support the HTML5 video element.
</video>

<p>
For the audio of this webpage, use the audio controls below.
</p>

<audio class="center" controls="controls">
<source src="aboutus/voiceover.mp3" type:"audio/mp3"/>
Your browser does not support the HTML5 audio element.
</audio>

CSS代码为：

video.center
{
display: block; 
margin-left: auto; 
margin-right: auto;
}

audio.center
{
display:block;
margin-left:auto;
margin-right:auto;
}

因此，我已经添加了display:block; CSS类，并且将边距设置为auto。 根据我遵循的教程，该应该起作用。 在下面，我附上了我期望得到的与我得到的（请注意：忽略视频缩略图和尺寸的不同）。 Expected Outcome与Obtained Outcome。

谢谢！