被css分配卡住了

Question

好吧，为模糊的标题道歉，这个问题要具体得多。我正在尝试一些非常简单的事情:将一段文字整齐地放在图像旁边。在这里，你可以找到作业的PDF文件，并附有成品的截图。这个链接允许您下载一个zip文件，其中包含与此相关的所有内容以及更多内容，但我也将把代码片段放在这里。

HTML代码

body
{
    font-family: "Segoe", sans-serif;
    font-size: 0.8125em;
}
    
h1
{
    font-size: 3em;
    color: #FF0000;
}
    
h2
{
    font-size: 2em;
    color: #575757;
}
    
h1+p
{
    font-size: 1.5em;
    color: #575757;
    background-color: #C5C5C5;
    border-color: #575757;
    border-width: 5px;
    border-style: solid;
}
    
body, h1, h2, p
{
    margin: 0;
}
    
img
{
    float: left;
    padding: 1em;
    overflow: hidden;
}
    
.top
{
    background-color: #D9D9D9;
    border-bottom: solid 5px #FF0000;
    padding: 1em;
}
    
.bot
{
    border-bottom: solid #FF0000;
}
    
.footer
{
    font-size: 1.2307692307692308em;
    font-weight: bold;
    color: #575757;
    background-color: #D9D9D9;
}

<div class="top">
    <img src="../../assets/logo.png" alt="logo">
    <h1>Main heading</h1>
    <p>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
    
<!-- alaosa -->
<div class="bot">
    <h2>Subheading</h2>
    <p>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu.</p>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.</p> 
    <p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.</p>
</div>
    
<!-- footer -->
<p class="footer">ITIY3 | SIS | UTA</p>

我不能发布两个以上的链接，但我希望每个人都能把7z打开。现在，问题是，我不认为我可以修改太多html因为作业都是关于CSS和html文件，连同图像一起提供。我所做的唯一一件事就是修改html文件，使src属性，以便找到图片，因为我有一个特定的文件夹结构，这些东西，我还添加了类div。然而，我不认为我被允许做任何更多的div，这应该是可以通过改变CSS文件。要找到HTML文件，解压缩7z并进入"TestZone/code/tehtava-3/tehtava3.html"，CSS文件可以在同一个文件夹中找到。

我会离开一段时间，但我会尽力澄清你可能想知道的任何事情。

sorry for this is a mess.

Answer 1

在你AFK期间，我们不会为你下载任何文件来完成你的作业。