Comments (1)
Solution:
set min-width: 0;
on the container holding the select box.
Still curious why the width of the options
element forces the width of the grid column. It obviously interacts with the bounding box in some way, but that interaction is not available anywhere. Style inspector panels still only show the box as the displayed with of the select
element while grid interprets it as the width of options
.
from gridbugs.
Related Issues (20)
- Has this fit-content / max-content bug been added yet?
- Chrome: justify/align-content do not work with flexbox HOT 1
- Webkit: Vertical writing-mode with margin on auto width column renders too large
- [Safari] When height is not specified for the parent element, the height of the child is 0 HOT 2
- Issue with chrome not calculating cell height/overflow correctly for nested grid HOT 5
- height: 100% changes a calculation based on sibling's intrinsic vs. explicit height
- CSS grid doesn't support word-wrap, overflow-wrap and hyphens properties HOT 1
- height: 100% on an image inside a grid, resize the image to height 0 HOT 1
- Nested grids with sticky positioning problem in Edge HOT 1
- Grid Height Chrome
- Specifying grid-template-columns using only percentages overrides box sizing HOT 3
- Grid overflow doesn't fit HOT 1
- Extra overflow-x on mobile devices
- safari: changing grid-item position to fixed on browser resize not supported HOT 1
- `repeat` with `auto-fill`, `minmax` and max-value being a `percentage` overflows instead of wrapping
- In columns sized only with 'fr' unit, overflow: auto (or scroll) is ignored in grandchild elements
- dark-themed browser issues HOT 1
- Safari Gives unexpected results with (I think) use of repeat auto HOT 4
- Safari align-content: center bug with nested grid container HOT 1
- Nested grid performance in Safari
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.