He's been a frontend dev for 7 years -- he can learn three new CSS properties that he claims would solve a major problem of his.
Beyond that, all of the CSS that he writes on a daily basis would become more robust once he learns a few more values (space-between, space-around, space-evenly, flex: 1;, etc.).
Please give the OP the benefit of the doubt and assume that he or she is a competent professional.
Here are some situations where you may want to test your understanding of centering in CSS:
+ Center an absolute positioned element whose width and height are unknown (e.g., it's an <img>).
+ Does anything change if the parent element has padding?
+ Create an element that's width 50%, height 50%, and center it in a parent of unknown size.
+ Do any of these solutions still work if all elements have a 10px border?
+ Which of these solutions will remain centered if the parent has smaller width/height than the child?
How confident are you in any of these solutions without being able to run them?
CSS is quite complex. It was built up incrementally by reasonable, intelligent people trying to solve hard problems.
If you're convinced that things are easy or that other people struggle simply because they are lazy, then you'll never be able to learn and grow your own skills.
You are right. My answer was lazy and not representative of real-world scenarios. For that I apologize.
The article OP mentioned[0] is from 2011 and antiquated unless you're writing for IE8 or below (which, of course, could still be a requirement).
I was merely trying to point out a better solution to OP's face-value problem and suggest a new CSS pattern that I personally have grown to love.
@iambateman - feel free to email me if you want some help learning some of these CSS techniques. I'll gladly walk you through them and answer any questions that I can.
Thanks for this. The discussion has been fascinating. Just wanted to add that the tweak-save-check-repeat pattern is awfully tedious and probably the bigger issue.
Making changes directly on an element in a way that makes sense is the holy grail, and remains an unsolved problem in my opinion. Browsersync can help, and Webflow (et al) is trying to help, but none of the tools allow real direct manipulation.
I also found this thread very interesting, and then I got here and thought I recognized your username. Turns out you asked to try the alpha of my own tool Cicerone (http://cicerone.co). Hi!
Cicerone doesn't yet do the kind of thing discussed here because it is originally designed to be a rich structured content editor with customizable HTML/CSS components, as opposed to a design tool. However the more I use it myself, the more I find that designing anything in CSS is the biggest PIA, and it would be really cool if I could bring a little sanity there. So I've been thinking a lot about how to do this. Stay tuned (but don't hold you breath, it'll be a while.)
PS: and if you do get around to poking around with Cicerone, do let me know your thoughts: good, bad, or random, I'm happy to nerd out on tools. Cheers Stephen.
