我如何把<aside>放在<body>旁边的右边？我在CSS中尝试了<aside align=right>和aside{ align-self: right}并且它不起作用。
body {
font-family: Calibri, Helvetica, Arial, Tahoma, sans serif;
color: #333;
background-color: #fff;
padding: 0;
margin: 0;
}
header, main, aside, footer {
padding: 6px;
margin: 0;
box-sizing: border-box;
}
header {
display: block;
background-color: #d10373;
color: #fff;
}
main {
width:100%;
display: -webkit-flex; /* Safari */
-webkit-flex-wrap: wrap; /* Safari 6.1+ */
display: flex;
flex-wrap: wrap;
}
article {
width: 80%;
}
aside {
width: 19%;
background-color: #ffccff;
}
footer {
display: block;
clear: both;
position: fixed;
bottom: 0;
width: 100%;
height: 40px;
background-color: #333;
color: #fff;
}<body>
<header>Your header goes here</header>
<main>
<article>
Your article goes here
</article>
<aside>
<ul>
<li>This</li>
<li>is</li>
<li>your</li>
<li>aside</li>
</ul>
</aside>
</main>
<footer>
Here's a footer
</footer>
</body>请注意，<aside>进入<body>并且内容的容器称为<main>。