html - 网页不适合屏幕

Question

我需要我的页面加载到 1280 宽度分辨率。它应该会加载，因此不会出现水平滚动条......它在“视频”页面上出现，我将在下面链接。如何修复我的页面以使其适合屏幕？我尝试了一些小调整，只是让页面变得疯狂。谢谢!

html:

<section class="left">  
    <h1>Video</h1>
    <article>
        <h2>Video implementation in HTML5</h2>
        <p>Support for HTML5 video has been growing steady. In June 2013, Netflix added support for HTML5 video. In January 2015, YouTube turned to HTML5 video as it's default player over Flash. In December 2015, Facebook switched from Flash to HTML5 for all video content. The Flash plugin is widely assumed,  including by Adobe, to be destined to be phased out, which will leave HTML5 video as the only widely supported method to play video on the World Wide Web.</p>
    </article>
    <article class="divider">
        <h2 class="elegantshadow">The single biggest reason why startups succeed</h2>
        <p>Bill Gross has founded a lot of startups, and incubated many others — and he got curious about why some succeeded and others failed. So he gathered data from hundreds of companies, his own and other people's, and ranked each company on five key factors. He found one factor that stands out from the others — and surprised even him.</p>
        <figure>
            <video  controls="controls">
                <source src="BillGross.mp4" max-width="200" type="video/mp4"/> 
                <source src="BillGross_VP8.webm" type="video/webm" />Your browser does not support the video tag / type
            </video>
        </figure>           
    </article>
</section>

CSS:

.container {
    display: flex;
}
aside {
    width: 30%;
}
section.left {
    width: 70%;
}
video {
    display: block;
    margin: 0 auto;
}

Answer 1

检查这个

.container {
display: flex;
}

section.left {
 width: 100%;
}

 video{
    display: block;
    margin: 0 auto;
}