A rather geeky/technical weblog, est. 2001, by Bramus
.element { position: relative; top: 50%; transform: translateY(-50%); } Same goes for horizontal centering. Where one – back in the day – would abuse margin-left by setting a negative margin to half of the width, we can now use translateX(-50%) to horizontally center a fluid-width box. .element { position: relative; width: 400px; left: 50%; margin-left: …
Continue reading “Vertical align anything with just 3 lines of CSS”
In this in-depth talk, ethnographer and leadership expert Simon Sinek reveals the hidden dynamics that inspire leadership and trust. In biological terms, leaders get the first pick of food and other spoils, but at a cost. When danger is present, the group expects the leader to mitigate all threats even at the expense of their …
123D Circuits.io enables beginners to easily get started with electronics. Instead of blowing up a component, you can now experiment freely in the live simulated virtual breadboard environment together with friends without being afraid of breaking something. 123D Circuits.io even allows you to simulate Arduino code along with your electronics to control it all or …
One of the assignments of one of the courses I teach requires my students to let a cube fall in a Three.js environment. To teach them about how something falls I used Choc to visualize and explain the process of falling per tick of the animation. The final code is available on CodePen. JavaScript Bouncing …
Last November I was lead technical reviewer for a book titled Google Maps JavaScript API Cookbook. On December 26th – my birthday, of all days – the book was released on Packt Publishing. It’s a very practical book with lots of code (hence it being a cookbook) touching basic map interactions, custom layers, drawing stuff …
I adore the smooth transition offered by Medium’s lightbox module — no disruptive modal window, and opening/closing of the lightbox is intuitive and straightforward. So I tasked myself with a little challenge — replicate it, and improve on it, if possible. CSS transitions and transforms FTW Fluidbox Demo → Fluidbox Source (GitHub) → Fluidbox Explanation →
Graffiti General is an immersive WebGL plunge into an abandoned building near Paris and the countless graffiti works that it enshrines. On the eve of it’s restoration, the memory of the building in its current state is preserved and accessible to everybody. Graffiti General was made possible thanks to a combination of the very latest …