Video 为什么中心与中心不同？

我有一个视频，并使其显示在左栏的中心

<div class="video"><video id="ukulele" controls="controls" width="320" height="240"><br /><source src="images/ukulele.mp4" type="video/mp4" /></div>

css

.video {margin: auto; width: 50%; padding: 1px;}

但文本以“This…”开头，并随着视频而衰减

为什么?

<p class="center"><i>This is aligned centered</i></p>

.center {display: flex; justify-content: center;}