所以我的固定位置有問題......當(dāng)卡外部有溢出自動時如何修復(fù)標(biāo)題？.outer-card{ padding-right: 20px; padding-left: 20px; overflow-y: auto; display: block; padding-bottom: 3px;}.card{ width: 1500px }<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet"/><div class="col-12 col-sm-6 align-items-stretch outer-card"> <div class="card"> <div class="card-body text-center select-year-month"> <div> <h5 class="card-title text-left">How to set this title not follow overflow so the title with stay in place while i scroll</h5> </div> <span>HAHAHAHAHAHA</span> </div> </div> </div>
1 回答
慕沐林林
TA貢獻2016條經(jīng)驗 獲得超9個贊
標(biāo)題位于內(nèi)部outer-card，您必須將其移到外部并添加包裝 div。然后你可以title使用包裝 div 進行絕對定位。
這將為您提供所需的行為。
附上工作片段。
.outer-card{
padding-right: 20px;
padding-left: 20px;
overflow-y: auto;
display: block;
padding-bottom: 3px;
}
.card{
width: 1500px
}
.container {
position: relative
}
.title{
position: absolute;
top: 0px;
left: 40px;
max-width: 500px;
text-overflow: clip;
overflow: hidden;
white-space: nowrap;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container">
<div class="col-12 col-sm-6 align-items-stretch outer-card">
<div class="card">
<div class="card-body text-center select-year-month">
<div>
</div>
<span>HAHAHAHAHAHA</span>
</div>
</div>
</div>
<h5 class="card-title text-left title">How to set this title not follow overflow so the title with stay in place while i scroll</h5>
</div>
- 1 回答
- 0 關(guān)注
- 112 瀏覽
添加回答
舉報
0/150
提交
取消