4 ms·
Just started a test project using flexbox and I'm finding myself using it constantly. In the "individual grid sample" why have you chose to make a 2/3rds and 1
by Already__Taken 11y ago
Just started a test project using flexbox and I'm finding myself using it constantly.
In the "individual grid sample" why have you chose to make a 2/3rds and 1/3rd column with divs respectively
flex:1; width:33.3333333%
instead of leveraging the ratio
flex:2; flex:1
- charliepark 11y agoI'm not sure I'm looking at the example you're looking at, but generally: a Flexbox layout will defer to the content, where when you're laying out on a grid, you want the content to defer to the grid. By giving an explicit width, you tell the browser that, in this case, the specified width is what's most important for the layout.
- Already__Taken 11y agoI see, That makes sense thankyou
- garethadams 11y agoLuckily, this is built into the flexbox model too. By default flexbox uses an element's automatic size as the basis to calculate its new size from. However if you set flex-basis to zero then it will treat the element as if it was zero width for the purposes of calculating its new size from. So if all elements have a zero basis then the flex ratio will be the only thing affecting their final width: http://codepen.io/anon/pen/WvGLML?editors=110 http://codepen.io/anon/pen/WvGLML?editors=110
- philipwalton 11y agoWhen you use gutters sometimes the math doesn't work out quite right. http://codepen.io/anon/pen/xGEMYY http://codepen.io/anon/pen/xGEMYY