寬度自適應

寬度自適應

指元素的寬度會隨著內文的多寡而自動調整。

無框表格

table,th,td 的寬度是自適應的。而整個 table 是可以靠 align 屬性水平置中的。

display:inline-block

行元素是自適應文本長度的

最大寬度與最小寬度

下以下 CSS 指示：

max-width:300px;
min-width:100px;
word-wrap:break-word;

讓容器伸縮，過長時自動換行。

css3 的 fit-content

對選擇器(如 UL)下以下 CSS 指示：

width:fit-content;
width:-moz-fit-content;
width:-webkit-fit-content;
margin:auto;

對 firefox 與 chrome 分別下寬度自適應的指示，再用 margin:auto; 將邊沿左右平分

水平置中

1. margin:auto;

參考資料

1. 理解CSS3 max/min-content及fit-content等width值