问题:我尝试向右浮动的图像从html/body元素周围的黑色边框中浮动出来，导致它有一半的图像不在视图中，它看起来像是在右下角浮动，而不是仅仅在右边浮动
为什么图像不包含在body边界内?
CSS
html {
padding: 0px;
margin: 0px;
background-color: white;
font-family: Verdana, Tahoma, sans-serif;
a:link,
a:visited {
color: hsl(0, 79%, 43%);
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
}
header {
width: 100vw;
}
h1 {
background-color: rgb(134, 0, 0);
position: sticky;
top: 0px;
font-size: 1.2em;
width: 90vw;
padding-top: 10px;
padding-bottom: 10px;
margin-right: auto;
margin-left: auto;
color: white;
padding: 20px
}
.headerNav {
width: 90vw;
margin-left: auto;
margin-right: auto;
padding-bottom: 5px;
text-align: left;
}
ul {
text-decoration-style: dashed;
}
.bodyOfPage {
width: 90vw;
margin-left: auto;
margin-right: auto;
border-style: solid;
border-width: 1px;
border-color: #CCCCC;
border-radius: 10px;
}
h2 {
font-size: 120%;
color: #666666
}
h3 {
color: #9f2424
}
footer {
width: 90vw;
margin-left: auto;
margin-right: auto;
font-size: 80%;
font-style: italic;
color: #666666;
}
a:link,
a:visited {
color: hsl(0, 79%, 43%);
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
figure {
float: right;
height: auto;
padding: 10px;
border-style: solid;
border-width: 1px;
border-color: rgb(204, 108, 108);
}
figcaption{
font-style: italic;
color: #666666;
}
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<link href='../week2/styles.css' rel='stylesheet'>
<meta charset="UTF-8">
<title>Data Breach Report January to June 2022</title>
</head>
<body>
<header>
<h1>Data Breach Report January to June 2022</h1>
<div class="headerNav">
<nav>
<ul>
<li>
<a href="exercise4.html">Executive Summary</a>
</li>
<li>
<a href="exercise5.html">Notifications received</a>
<ul>
<li>
<a href="exercise5.html#large-scale">Large Scale Breaches</a>
</li>
</ul>
</li>
<li>
<a href="exercise6.html">Source of Breaches</a>
<ul>
<li>
<a href="exercise6.html#malicoius-or-criminal">Malicious or criminal attacks</a>
</li>
<li>
<a href="exercise6.html#cyber-incidents">Cyber Incidents</a>
</li>
<li>
<a href="exercise6.html#human-error">Human Errors</a>
</li>
<li>
<a href="exercise6.html#system-faults">System Faults</a>
</li>
</ul>
</li>
</ul>
</nav>
</div>
</header>
<hr>
<div class="bodyOfPage">
<p>The Office of the Australian Information Commissioner (OAIC) periodically publishes <a
href="https://www.oaic.gov.au/privacy/notifiable-data-breaches/notifiable-data-breaches-statistics">statistical
information</a> about notifications received under the <a
href="https://www.oaic.gov.au/privacy/notifiable-data-breaches">Notifiable Data Breaches (NDB)
scheme</a> to help entities and the public understand privacy risks identified through the scheme. This
report captures notifications made under the NDB scheme from 1 January to 30 June 2022.</p>
<p>Statistical comparisons are to the period 1 July to 31 December 2021 unless otherwise indicated.</p>
<p>Where data breaches affect multiple entities, the OAIC may receive multiple notifications relating to the
same incident. Notifications relating to the same incident are counted as a single notification in this
report unless otherwise specified.</p>
<p>The source of any given breach is based on information provided by the reporting entity. Where more than one
source has been identified or is possible, the dominant or most likely source has been selected. Source of
breach categories are defined in the glossary at the end of this report.</p>
<p>Notifications made under the My Health Records Act 2012 are not included as they are subject to specific
notification requirements set out in that Act.</p>
<p>Statistics in this report are current as of 30 September 2022. Some data breach notifications are being
assessed and adjustments may be made to related statistics. This may affect statistics for the period
January to June 2022 published in future reports. Similarly, statistics from before January 2022 in this
report may differ from statistics published in previous NDB reports.</p>
<h2>Executive summary</h2>
<p>The NDB scheme was established in February 2018 to improve consumer protection and drive better security
standards for protecting personal information. Under the scheme, any organisation or government agency
covered by the <a
href="https://www.oaic.gov.au/privacy/the-privacy-act/rights-and-responsibilities/?stage=Stage#OrgAndAgencyPrivacyActCovers">Privacy
Act 1988</a> that experiences an eligible data breach must notify affected individuals and the OAIC.</p>
<p>The OAIC publishes twice-yearly reports on notifications received under the NDB scheme to track the leading
sources of data breaches and highlight emerging issues and areas for ongoing attention by regulated
entities.</p>
<figure>
<img src="/twa/twa021/practicals/images/executive-summary.png" alt="Summary of Breaches" width="656"
height="411">
<figcaption>
Illustrative Summary of the Data Breaches between January and June 2022
</figcaption>
</figure>
<h3>Key findings for the January to June 2022 reporting period:</h3>
<ul>
<li>396 breaches were notified compared to 460 in July to December 2021 (<b>14% decrease</b>).</li>
<li>Malicious or criminal attack remains the leading source of breaches accounting for 250 notifications
(63% of the total), down 1% in number from 253.</li>
<li>Data breaches resulting from <mark>human error accounted for 131 notifications (33% of the total), down
31% in number from 189.</mark></li>
<li>Health remains the highest reporting sector notifying 20% of breaches, followed by finance (13%).</li>
<li>Contact information remains the most common type of personal information involved in breaches.</li>
<li><mark>91% of breaches affected 5,000 individuals or fewer, while 65% affected 100 people or
fewer.</mark></li>
<li><em>71% of entities notified the OAIC within 30 days of becoming aware of an incident.</em></li>
</ul>
</div>
<footer>
<p>Information has been sourced from <a href="https://oaic.gov.au">OAIC</a> and the <a
href="https://www.oaic.gov.au/__data/assets/pdf_file/0020/23663/OAIC-Notifiable-Data-Breaches-Report-Jan-Jun-2022.pdf">Notifiable
Data Breaches Report January to June 2022</a></p>
</footer>
</body>
</html>
我试过移动整个body的边框，甚至是footer，但是它只是停留在原地
任何帮助都是非常感谢的:)
将overflow: auto添加到.bodyOfPage中以完全包裹其中的浮动元素