The default CSS rules are set for the "large" layout; the "exception" is for small screens
That "flex: 1" actually means flex-grow : 1; flex-shrink : 1; flex-basis : 0; (courtesy of stackoverflow.com/questions/373862...). I set those values as defaults for every columns and...
Changed the CSS so that every column has the class 'column', but adding s2 or s3 makes them wider
I am not 100% sure when we would ever want to use flex-wrap: wrap;. However, I left it there.
I basically spelt every out in terms of CSS rules, and "reversed it out" to make it easier to understand.
Would you consider updating the article with this updated CSS? If not, I will be happy to write an article about it (obviously linking back to you!)
Ah I thought you were the author -- sorry!
I updated my comment with the correct link. Well spotted. I nearly had a heart attack, thinking that I had lost it!
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
I am no expert either, but I have worked on the CSS a lot... here is the result:
codepen.io/mercmobily/pen/KKddYNJ
Basically:
I am not 100% sure when we would ever want to use flex-wrap: wrap;. However, I left it there.
I basically spelt every out in terms of CSS rules, and "reversed it out" to make it easier to understand.
Would you consider updating the article with this updated CSS? If not, I will be happy to write an article about it (obviously linking back to you!)
I didn't write the article, just a comment 🙂
Wrong link? the link you posted is just a link to the codepen I posted? 😉
I didn't write the article, I just wrote a comment 🙂
(Also, wrong link? The link you posted is just a link to the codepen I posted.)
Ah I thought you were the author -- sorry!
I updated my comment with the correct link. Well spotted. I nearly had a heart attack, thinking that I had lost it!