Как сделать ширину этого видео 100% отзывчивой? - PullRequest
Новая
       10

Как сделать ширину этого видео 100% отзывчивой?

0 голосов
/ 16 мая 2019

Я создаю сайт Shopify и хочу показать видео героя сверху.Но видео почему-то наклоняется вправо, оставляя пробел слева.Кто-нибудь знает, как я могу сделать его на 100% отзывчивым?Я не знаю много о кодировании, и я сделал все, что мог ... любая помощь приветствуется.

Потратил три дня на поиски, но тщетно ...

Мой сайт здесь: https://v3xt5u4y7es2qbjl -22601531467.shopifypreview.com

Видео на самом верху не совсем то, что я хочу.Я просто хочу сохранить второе видео.

HTML 

<div id="hero_video">
<video autoplay="" playsinline="" muted="" loop="" id="Hero_Video">
  <source src="https://cdn.shopify.com/s/files/1/0226/0153/1467/files/background_video_1.mp4?1009" type="video/mp4">
</video>
</div>

CSS 

#Hero_Video {
  position: relative;
  width: 100vw;
  max-height: 100%;
}

/* Hero Video Style*/
.hero_video{
    left: 50%;
    margin-left: -200vw;
    margin-right: -50vw;
    max-width: 100vw;
    position: relative;
    right: 50%;
    width: 100vw;
}

Ответы [ 2 ]

1 голос
/ 16 мая 2019

добавьте ширину 100% к вашему видео, и оно должно работать 

#Hero_Video {
    width: 100%;
}
0 голосов
/ 16 мая 2019 
    #Hero_Video {
      position: relative;
      ....
    }

    /* Hero Video Style*/
    .hero_video{
        left: 50%;
        ...
        width: 100vw;
    }

> <div id="hero_video"> <video autoplay="" playsinline="" muted=""
> loop="" id="Hero_Video">

"."для класса и "#" для id.Во-первых, я думаю, что у вашего css есть проблема

...