0
大きな画面用にウィンドウのサイズを変更すると、サイドバーのdivがウィンドウとともに移動して、mainContent divとサイドバーDivの間にスペースができているようです。ウィンドウのサイズを変更すると、サイドバーとmainContent divが分離しています。直し方？
目的：両方のdivがウィンドウのサイズ（Facebookと思う）に関係なく、ウェブサイトの中央に、互いに隣り合っていてほしいです。
誰かが私を助けることができますか？ありがとうございました。
* {
background-color: black;
}
.wrapper {
display:flex;
z-index: 0;
}
.topDiv{
background-color: rgb(255,255,255);
width:100%;
height: 100px;
position:fixed;
top:0;
left:0;
z-index: 1;
}
.Nav{
background-color: rgb(60,60,60);
width:100%;
height:50px;
position:fixed;
top:100px;
left:0;
z-index: 2;
}
.content{
background-color: rgb(255,255,255);
width:100%;
height:100%;
position:fixed;
top:150px;
left:0;
z-index:3;
}
.mainContent{
background-color: rgb(125,125,125);
position:fixed;
width:65%;
max-width: 720px;
height:100%;
left:10%;
z-index: 4;
}
.sidebar{
background-color: rgb(160,160,160);
position:fixed;
width:15%;
max-width: 240px;
height:100%;
right:10%;
z-index: 5;
}
.footer{
background-color: rgb(51, 56, 60);
position: fixed;
width: 100%;
height:75px;
bottom:0;
left:0;
z-index: 6;
}<!DOCTYPE html>
<html>
<!-- DRAFT HOUSE INC. -->
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div class="wrapper">
<div class="topDiv">
</div>
<div class="Nav">
</div>
<div class="content">
<div class="mainContent">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque malesuada turpis ex, ut egestas nisi tincidunt non. Nulla auctor ullamcorper lectus, nec aliquet nulla pulvinar et. Etiam sit amet tortor metus. Morbi ut molestie quam, non vestibulum lorem. Sed lectus diam, malesuada sit amet maximus non, fermentum a justo. Proin leo neque, egestas at enim at, consequat ultricies lorem. Curabitur in nisi velit. Quisque quam tortor, blandit sed tellus ut, sollicitudin suscipit risus. Ut sit amet pretium est. Cras lobortis diam vitae varius auctor. Ut interdum felis et quam lacinia gravida.
Nulla varius fermentum leo ut porttitor. Aenean viverra commodo ante ut rutrum. Morbi sed pellentesque felis. Curabitur fringilla justo massa, porta accumsan sem mollis et. Aenean eu massa id justo semper facilisis in ac ligula. Aenean laoreet, arcu eget condimentum consequat, turpis eros dignissim erat, in vehicula dui arcu ac elit. Donec sit amet massa accumsan, viverra tellus quis, tincidunt nibh. Donec in justo at sem rhoncus blandit id sit amet ipsum.
</div>
<div class="sidebar">
</div>
</div>
<div class="footer">
</div>
</div>
</body>
</html>