DIV要素の横並びで表示したい

Question

wrapper2のdivの中でdiv要素を横並びで2列表示にしたいです。

wrapper2は画面の一番下までいっぱいになるように広げたいので
position: fixed;を指定しました。

pinkとredの要素を２列横並びにしたいのですが、
pinkは正常に表示され、redが表示されません

何が悪いのでしょうか。。

<main>
  <div class="wrapper2">
     <div class="wrapper2-container container-left">
                    
     </div>

     <div class="content2-container container-right">
                
     </div>
   </div>
</main>

.wrapper2 {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  position: fixed;
  display: flex;
  background-color: #91cd79;
}

.wrapper2-container {
  width: 50%;
}

.container-left {
  float: left;
  background-color: pink;
}

.container-right {
  float: left;
  background-color:red;
}

Answer 1

container-rightにつけたクラスが
wrapper2-containerではなく
content2-containerになっています

Comments

[yambejp]

それとflexの子要素にfloatする必要はないと思います

[Qoo]

ありがとうございます！
単純ミスに気がつかず…。お恥ずかしいかぎりです。。

Answer 2

.content2-containerは何もstyle指定しないのでしょうか。