This article isn’t about vertically-centered text but horizontally-centered text. You don’t expect the starting place of each line to change with vertically-centered text!
centered 'stuff' is not evil. Centered blocks of paragraphs are not as pleasing to look at and are harder to work around with the rest of your content elements making up the design. But he's talking about centering it from top to bottom: vertically centered. Which is not evil but would be a very easy thing for CSS to just do in all browsers. yet it can't seem to accomplpish it. Every 'rule' can be broken when done effectively. another expert will tell you that only a minority reads our paragraphs of text anyway. And another expert will tell you that the harder it is to read something the better the comprehension will be.
If clean lines really solved the worlds problems, we'd be in much better shape by now.
If you're the developer that's your job to tell that to your boss. Come up with analytics to support your findings, make your case, he's probably not going to be reading this thread and staying up to date on all the latest and greatest that's your job. He may be stubborn or you might find out that your user base is all IE6 I don't know but sitting around complaining isn't going to get you anywhere either :)
Analytics are irrelevant when you're writing some huge internal service for a company whose conservative upgrade policy dictates that only one older browser will be installed and used company-wide until God-knows-when.
By the way, glancing at a few browser market share websites, it looks like IE8 and IE9 are alive and well, totaling around the same as IE11.
Lol I am hardly "sitting around and complaining." At my last agency gig we had to support down to IE6 for several months until we built a strong case to only support down to IE8. Even still it was much harder and protracted battle than it should have been.
My fancy looking website doesn't have to look good on somebody's office computer. If they had a good firewall, it would probably be blocked anyway. Also, people still on old IE are used to seeing websites all busted up.
These have been supported for a while now – you're not going to get old browser support, but they're not going to support 3D features either, so your complaint is either flame bait or ignorance.
Webkit keeps prefixes usually because it is not implemented fully and it is an experimental feature. They began unprefixing flexbox in Sept. 2014, I don't know when it's gonna ship.
Though, its super unfair that the Web Inspector in Webkit uses unprefixed Flexbox (http://trac.webkit.org revision 173707).
Aren't you comparing the capability to do 3D with the straightforwardness of vertical centering, though? Certainly CSS has the capability to do vertical centering of multiline text, and I wouldn't call the 3D rendering strategy in this experiment amazingly straightforward---in fact, the cleverness of the technique is one of the things that makes this experiment so cool.
I loaded this page in Safari, tried scrolling it, and then Safari did the 'This page was reloaded' thing. Then my iPhone 6 Plus spontaneously rebooted. The crash is repeatable, too.
I can view it successfully in Chrome (and this is an amazing demo!). Safari shows a gray background with a blue circle, then crashes as described. I don't have the latest iOS update installed though...
So, I upgraded to 8.1.3 and now Safari will reload the page a couple of times, then crash. There's no kernel panic or whatever now, though, only Safari crashes.
Edit: never mind that, I cleared my Safari data, reloaded the page, and it once more made my entire phone reboot.
If you have a look at the scene (with Inspect Element), it's actually pretty simple. It's six walls (each an image), and each of the four sides also has another 5 walls behind it (each also an image) with a statue (image).
That, combined with how CSS 3D transforms let you describe 3D graphics in a declarative way (there's an image at some position with some rotation), rather than in an imperative way (bind the buffer, link the shader, do the 3D rendering dance, draw this thing at some position I bound and some rotation I chose, etc.), allows it to be very small.
As always, while declarative programming doesn't lead to brilliant performance, it produces much nicer code and it's much easier to write.
The source code is beautiful. Code can be art when you know what you're looking at/looking for, kinda like real art. (I don't like his if/else blocks though)
From github "Inspired by Gerard Ferrandez's 3D experiment. Thank you." And if you go to the about url of this story it appears to be Gerard Ferrandez's personal site. (http://www.dhteumeuleu.com/about)
60 comments
[ 2.6 ms ] story [ 141 ms ] threadAnyways, centered stuff is evil! http://uxmovement.com/content/why-you-should-never-center-al...
If clean lines really solved the worlds problems, we'd be in much better shape by now.
Analytics are irrelevant when you're writing some huge internal service for a company whose conservative upgrade policy dictates that only one older browser will be installed and used company-wide until God-knows-when.
By the way, glancing at a few browser market share websites, it looks like IE8 and IE9 are alive and well, totaling around the same as IE11.
These have been supported for a while now – you're not going to get old browser support, but they're not going to support 3D features either, so your complaint is either flame bait or ignorance.
For Safari still the -webkit prefix is required which is a bit odd
Though, its super unfair that the Web Inspector in Webkit uses unprefixed Flexbox (http://trac.webkit.org revision 173707).
Quite beautiful, code and result.
So I made this: http://demos-sxx.rhcloud.com/apparently-transparent/
Some glitches in desktop Safari 8 and it crashes my poor iPhone 4S repeatedly.
Works perfectly on my iPhone 6 (no Plus) in iOS 8.1.3.
I'll try it after I upgrade to 8.1.3.
Edit: never mind that, I cleared my Safari data, reloaded the page, and it once more made my entire phone reboot.
That, combined with how CSS 3D transforms let you describe 3D graphics in a declarative way (there's an image at some position with some rotation), rather than in an imperative way (bind the buffer, link the shader, do the 3D rendering dance, draw this thing at some position I bound and some rotation I chose, etc.), allows it to be very small.
As always, while declarative programming doesn't lead to brilliant performance, it produces much nicer code and it's much easier to write.
Amazing stuff in there.