0
暗いボックスの右側にテキストを配置したいと思います。暗い箱の上にある「AAAAAAAAAAAAAAA」が右側に表示されます。私はそれを別のコンテナに書き込んでみましたが、暗いボックスを押し下げています。ありがとうございました！テキストを正しい場所に移動するには？
html {
height: 100%;
}
body {
min-height: 100%;
margin: 0;
padding: 0;
}
.gray-container {
background: #E5E5E5;
width: 60%;
margin: 0 auto;
min-height: 600px;
margin-top: 20px;
border-left: 10px
}
.dark-container {
background: #B9B9B9;
width: 20%;
margin: 0 auto;
min-height: 660px;
margin-top: 20px;
margin-bottom: 20px;
margin-left: 20px;
padding-left: 30px;
}
.text {
text-align: justify margin: 20px 20px 30px 100px;
}
img {
width: 300px;
height: 90px;
padding: 30px 30px 30px 50px;
}
.gray-banner {
float: left;
width: 60%;
min-height: 20px;
padding: 10px 0 0 10px;
background-color: #E5E5E5;
position: relative;
margin-top: 20px;
}
ul {
list-style-type: none;
margin: 0 120px 0 0;
padding: 0;
overflow: hidden;
border: 1px solid #e7e7e7;
background-color: #fff;
}
li {
float: left;
border-right: 1px solid #bbb;
border-color: #87CEFA;
width: 200px;
}
li:last-child {
border-right: none;
}
li a {
display: block;
color: #666;
text-align: center;
padding: 14px 5px;
text-decoration: none;
}
li a:hover:not(.active) {
background-color: #ddd;
}
li a.active {
color: white;
background-color: #4CAF51;
}
.container {
width: 100%;
display: flex;
justify-content: space-around;
align-items: center;
flex-wrap: wrap;
padding: 0 14px 15px 15px;
}
h1 {
margin: 5px 5px 15px 44px;
font-family: calibri;
}
h2 {
margin: 50px 27px 0 45px;
font-family: calibri;
}
p {
margin: 50px 27px 0 45px;
font-family: calibri;
font-size: 20px
}<div class="container">
<img src="https://img.clipartfest.com/c61469b195ccf8a2f1090f2673258543_-of-the-nintendo-logo-nintendo-logo-clipart_1024-239.gif" />
<ul>
<li><a href="a.html">a</a></li>
<li><a href="b.html">b</a></li>
<li><a href="c.html">c</a></li>
<li><a href="d.html">d</a></li>
<li><a href="e.html">e</a></li>
</ul>
<div class="gray-banner">
<h1>eeeeeeee</h1>
</div>
<div class="gray-container">
<div class="text">
<p>AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA</p>
</div>
<div class="dark-container">
<h2 style="font-size: 24px; margin: 10px 5px 5px 0; "><br>hey</h2>
</div>