So today I was doing bit of generic experiments/studies with CSS.
I bellieve I wrapped my mind around column drop flexbox pattern, and also mostly fluid, they are almost the same as far as I figured, and most simple ones.
Below link on my codepen. In the code itself, there are bunch of comments:
questions
thoughts
explanations
It is basically carcass for column drop layout. Maybe I will use it as boilerplate when it will be appropriate for some project.
To test it for responsivity in Chrome(if you don’t know)
ctrl+shift+i open Dev tools
ctrl+shift+m test for responsivity (at the top will appear dropdown menu, you can check how it looks on different devices )
Here some more general questions.
For now I want to dive in some more common flex/grid patterns and apply some of them for my existing fCC Responsive Web Design cert. projects(I’ve done so little in terms of styling them and already refactoring it - that’s kinda feels dumb )
I wish to have some amount(?) patterns familiar to me.
I wanna set up in my head some kind of CSS-related logic:
Let’s say I have some content.
I need to make some page with this content.
I believe I am capable to end up with appropriate HTML structure.
I wanna be able to choose correct pattern first based on content and HTML structure.
Patterns are useful but not ideal, so after that I need to modify pattern for particular case.
I think for now I will stick to that. Some skills like styling text, deal with tables - I’ll polish it in the process.
And also I need some cheatsheet: what needs to be done for accessibility.
I would appreciate any feedback about stuff above.
PS.
When I am choosing font-style or some… let’s say border-radius it is extremely irritating.
I always think: 'Why the hell it’s Tahoma font?Why is it not Verdana? Or something else? That doesn’t make any sense!"
My brain wants to find some math logic, but there is none