我想问你一件困扰我一段时间的事。我现在学习HTML和CSS，我们做了一个功课，我们必须创建一个博客，中间有一篇文章，右边有两个边栏，网站的背景颜色应该是灰色的。问题是主文章和两个边栏应该是白色的底色，所以当我把文章的底色改成白色时，它就自动控制了网站75%以上的区域，甚至是文章之外。这里是一个截图。

我正在尝试制作的内容https://f.v1.n0.cdn.getcloudapp.com/items/0k300n0o0j0c1l1b3k2j/blog-1.png

将侧边栏的背景色更改为白色时得到的内容https://ctrlv.sk/wf4e

null

.main-image {
    height: 260px;
    width: 670px;
}
.main {
    text-align: center;
    padding: 40px;
    margin-top: -10px;
}
.main2 {
    background-color: white;
}
body {
    background-color: rgb(243, 243, 243)
}
.line {
    margin-top: 50px;
}
hr {
    margin-top: -20px;
}
.back {
    background-color: white;
}
.box-post {
    background: white;
    margin-left: 70px;
}
.sideimage {
    float: right;
    margin-top: -340px;
    width: 350px;
    margin-right: 100px;
    display: block;
}
.sidetext {
    text-align: right;
    margin-top: -180px;
    margin-right: 160px;
    
}

<title>Blog</title>
    <link rel="stylesheet" href="styles.css">
<header>
    <div class="main2">
    <h1 class="main">
        <strong>Dopetrope</strong>
    </h1>
    </div>
    <hr>
</header>
<section id="main">
    <article class="box-post">
        <img class="main-image" src="pic01.jpg" alt="obrazocek">
        <header>
            
            <h1>Right sidebar</h1>
            <h3>Lorem ipsum dolor sit amet feugiat</h3>
            <div>
        </div></header>
        <p>
</p><section class="box">
    <img class="sideimage" src="pic09.jpg">
    <h1 class="sidetext2">Sed etiam lorem nulla</h1>
    <p class="sidetext">
        Lorem ipsum dolor sit amet sit veroeros <br>
        sed amet blandit consequat veroeros <br>
        lorem blandit adipiscing et feugiat <br>
        phasellus tempus dolore ipsum lorem <br>
        dolore.
    </p>
</section>
            <p>
            Vestibulum scelerisque ultricies libero id hendrerit. Vivamus malesuada quam faucibus ante <br>
            dignissim auctor hendrerit libero placerat. Nulla facilisi. Proin aliquam felis non arcu molestie at <br>
            accumsan turpis commodo. Proin elementum, nibh non egestas sodales, augue quam aliquet est, <br>
            id egestas diam justo adipiscing ante. Pellentesque tempus nulla non urna eleifend ut ultrices nisi <br>
            faucibus. <br><br><br>
            Praesent a dolor leo. Duis in felis in tortor lobortis volutpat et pretium tellus. Vestibulum ac ante <br>
            nisl, a elementum odio. Duis semper risus et lectus commodo fringilla. Maecenas sagittis convallis <br>
            justo vel mattis. placerat, nunc diam iaculis massa, et aliquet nibh leo non nisl vitae porta lobortis, <br>
            enim neque fringilla nunc, eget faucibus lacus sem quis nunc suspendisse, nec lectus sit amet <br>
            augue rutrum vulputate ut ut mi. Aenean elementum, mi sit amet portittor lorem ipsum dolor sit <br>
            amet, consecteur adipiscing elit. Lorem ipsum dolor sir amet nullam consequat feugiat dolore <br>
            tempus.
            
            </p>
    </article>
</section>

null

有什么办法可以改变吗？我希望你能理解我想要得到什么。另外，如果代码是错误的，请不要太在意它，我对这个东西还是很新的：d