---
# System prepended metadata

title: 多項目自動填滿寬度
tags: [Css]

---

---
tags: Css
---
# 多項目自動填滿寬度
###### tags: `css`
```css
#parent {
  display: flex;
  flex-wrap: wrap;
}

.child {
  flex: 1;
  min-width: 25%;
}
```
<iframe height="300" style="width: 100%;" scrolling="no" title="Wrapping Flexbox with Media Query Widths" src="https://codepen.io/chriscoyier/embed/BaajoV?default-tab=html%2Cresult" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
  See the Pen <a href="https://codepen.io/chriscoyier/pen/BaajoV">
  Wrapping Flexbox with Media Query Widths</a> by Chris Coyier  (<a href="https://codepen.io/chriscoyier">@chriscoyier</a>)
  on <a href="https://codepen.io">CodePen</a>.
</iframe>
https://css-tricks.com/filling-space-last-row-flexbox/