设置导航栏fixed的问题，子元素不能随父元素固定？

Question

html代码如下

<div class="banner clearf">
    <div class="logo">
        <a href= "lbt.html" id="logo">乎之</a>
    </div>
    <div class="banner-container ">
        <div class="item">1</div>
        <div class="item">2</div>
        <div class="item">3</div>
    </div>
</div>

css如下
.banner{

width: 100%;
display: block;
position: fixed;
top: 0;
background-color: rgba(255, 255, 255, 1);
height: 70px;
box-shadow:0 3px 5px rgb(118, 231, 217);
border-radius: 1px;
z-index: 100;

}

logo {

display: block;
text-decoration: none;
height: 70px;
margin-left: 15%;
color: rgb(104, 105, 236);
font-size: 3em;

}
.clearf::after{

clear: both;

}
.clearf::before{

clear: both;

}
.banner-container {

top: -100px;
height: 100%;
width: auto;
border: 1px solid black;
border-color: rgb(110, 56, 28);

}
.banner-container .item{

float: left;

}

banner-container里面的内容不能随父级div banner固定在顶部
请问哪里出了问题
定位position问题还是float的问题？

Answer 1

怎么不能固定了，可以的啊

Answer 2

logo的display:inline-block.
block会占据行。
你给的码不全，css的logo是a的吗？这样写很不规范耶

Answer 3

你给.banner{height:70px;} .banner-container{height:70px; } 父级都装不下了你说他换行不