TLDR: How to code a web site that looks like this
And will resize down to this.
Try the demo CSS code here.
I am, in my heart of hearts, a database developer. If you ask me what I do, I code SQL.
But I'm also insatiably curious, I want to know how the things around me work. So, I know some networking. I know web server management, SQL management.
And I'm learning CSS.
As a part of my quest, I wrote this site (www.dyndeveloper.net) and the business site (www.4penny.net), by hand (in other words, I didn't use WordPress, or some framework like that).
And I used TABLEs. The whole site was tables inside of tables inside of tables. Because 10 years ago, that's how it was done. Three major things have happened to cause us to move away from that: The death of IE, cell phones, and the rise of the CSS display:grid. Any site that you write in today's world MUST display on a cell phone. So, how can you do that? (stop for a second and resize this web site from full screen to as narrow as it will go, slowly)
This article is a simple(ish) exampe of how to code a web site using display:grid so that it will be RESPONSIVE. That means that it will work on the largest and smallest displays at the same time. Important word, remember that. There will be a buzz word test at the end.
Two: I need to know if you care about CSS content. Should I blog on it? Here, we're GP developers, but I can tell you that in 20 years, I've coded a number of internal sites that attach to GP. A major university, a large plant, a large distributer all use sites that I've built. It's a good skill to know. Want to learn more?
Please... if you've read this far, leave me a comment below.
All the code is in the article below.