Видео div в центре

Question

У меня проблема с видео в центре. Я не мог добраться до центра дивы.

Это мой html-код.

<div id="aside"> 
    <div id="videoClip"> 
     <p> Check out my new video clip! </p> 
     <p> 
      <video id="video" class="video-js vjs-default-skin" 
      controls preload="auto" width="400" height="300" 
       poster="my_video_poster.png" data-setup="{}"> 
      <source src="my_video.mp4" type='video/mp4'> 
     <source src="my_video.webm" type='video/webm'> 
     </video> 
     </p> 
    </div> 
</div> 

и мой КСС это

#aside { 
    float:left; 
    width:40%; 
    text-align:center; 
} 

#aside p { 
    margin:20px 0; 
} 

#aside img { 
    border:1px solid black; 
    height:400px; 
} 

#videoClip { 
    margin:0 auto; 
} 

И попытаться проверить это JSFIDDLE

Я уже поставил VideoClip margin:0 auto; и до сих пор не работает. А также, если я положил text-align:center, также не работает.

Answer 1

Он находится внутри стороне, которая составляет всего 40% в ширину

и

#videoClip { 
    margin:0 auto; 
    display:block; 
    float:none; 
} 

Answer 2

У вас есть окружающая div#asidefloat: left и width: 40%. Это, конечно, ограничивает video. Когда вы делаете полную ширину aside, то video будет центрирован правильно

#aside { 
    float:left; 
    width:100%; 
    text-align:center; 
} 

См JSFiddle

Или просто оставить вне width и float будет работать, а

#aside { 
    text-align:center; 
} 

JSFiddle