youtube動画をフレキシブルに埋め込む

【show.blade.php】

                    <div class="video-container">
                        <iframe src="{{ $product->youtube_url }}"
                                frameborder="0"
                                allow="accelerometer; autoplay;

　　　　　　　　　　　　encrypted-media; gyroscope;

　　　　　　　　　　　　picture-in-picture"
                                allowfullscreen></iframe>
                      </div>

【resources/css/youtube.css】

.video-container {
    position: relative;
  width: 100%;
  overflow: hidden;
  padding-bottom: 56.25%;
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none; 
}

【resources/css/app.css】

@import 'youtube';

www.granfairs.com