亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

CSS - Overflow-x:滾動切斷 div 的開頭

CSS - Overflow-x:滾動切斷 div 的開頭

呼如林 2023-10-24 19:44:50
這可能是一個簡單的修復,但我在任何地方都找不到它 - 也許我使用了錯誤的術語,所以如果我重復已經提出的問題,我深表歉意。我創建了這個 stackblitz 演示:https ://stackblitz.com/edit/angular-ftv8ez我遇到了這個問題,我有一個固定寬度(300px)的容器 div。其中,我有一些盒子 div,也具有固定寬度(300px)。容器div有overflow-x:scroll,所以這個想法是,如果div溢出,你可以滾動它。然而,結果并沒有達到預期的效果。容器 div 的開頭被縮短,這導致無法將第一個框滾動到視圖中。非常歡迎任何提示或幫助!
查看完整描述

2 回答

?
隔江千里

TA貢獻1906條經驗 獲得超10個贊

要修復此問題,您可以將 .container justify-content 值從更改justify-content:centerjustify-content:start



查看完整回答
反對 回復 2023-10-24
?
慕哥6287543

TA貢獻1831條經驗 獲得超10個贊

他們的 .css 代碼中存在錯誤。在 .Box 中,您需要更改 .box 中的高度和寬度,或者需要更改滾動容器的寬度,因為您將大小設置為 300px,將其更改為 500 或更少,并且放置了 4 種顏色的100px 現在我將代碼更正為 50px 并且它可以工作。


p {

  font-family: Lato;

}

.container {

  display: flex;

  justify-content: start;

  width: 300px;

  overflow-x: scroll;

}

.red {

  background-color: red;

  margin-right: 10px;

  flex-shrink: 0;

}

.yellow {

  background-color: yellow;

  margin-right: 10px;

  flex-shrink: 0;

}

.blue {

  background-color: blue;

  margin-right: 10px;

  flex-shrink: 0;

}

.green {

  background-color: green;

  flex-shrink: 0;

}


.box {

  width: 50px;

  height: 50px;

}


查看完整回答
反對 回復 2023-10-24
  • 2 回答
  • 0 關注
  • 145 瀏覽

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號