I have the following codepen https://codepen.io/gandalf458/pen/JjjPRJv
I want to do away with the margin on col2 using flex properties instead… I have tried adding justify-content: space-between; to the column element but I don’t get any space between my columns.
Where have I goofed?
The problem is that because you have flex-grow set to a value then there will be no space between. e.g. flex:1 0 25% will make the element at least 25% (space permitting) but if nothing else is in the way it will stretch to the full 100%.
If you use flex:0 0 25%; then the element will stay at 25% unless content forces it wider (unlike width).
The easiest way to have a margin is as you did it with a margin on the middle column. If you want it automatic then you can apply margins to all columns but you would need to offset them a little first and makes it a little harder to understand.
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.