子元素固定寬度 父元素寬度被撐開

豬豬是天才發表於2018-12-19

背景：父元素寬度百分百，子元素固定寬度，當父元素的寬度變小，子元素會被擠下去，如何讓子元素的寬度決定父元素的寬度，讓父元素的寬度被撐開？

解決方法：

1.若 父元素 下的子元素是 行內元素（有固定寬度）

父元素 {
    white-space: nowrap;  // 子元素不被換行,超出部分 scroll 表現
}複製程式碼

2.若 父元素 下的子元素是 塊級元素 （預設寬度百分百）

父元素 {
    white-space: nowrap;  // 子元素不被換行
    display: inline-block;
} 子元素 {
     display: inline-block;
 }複製程式碼

參考連結


相關文章