Centering a Div with Physics, Instead of CSS

http://jared314.github.io/physics-based-page-layout/ (Javascript Required) After the last CSS centering article, I thought there had to be another way. So, I put together a basic Physics-based Page Layout system using an existing Javascript physics library, for springs, and an existing Javascript CSS parser library, for CSS Selectors and a custom CSS-like DSL. The end goal is to layout DOM elements with springs, and eventually collisions, instead of floats, margins, or padding.

Alternatives

Does the same job

all alternatives →

CC
Chartss.css – accessible HTML/CSS charts with markdown support2020 · rbitr.github.io · ▲265
Layer CSS2015 · ▲152
Lightweight CSS framework to build your own fluid layouts
AS
A simple lightweight CSS grid, not a bloated framework2012 · thisisdallas.github.com · ▲134
Spacegrid CSS2017 · ▲139
A basic, responsive grid layout.
Simple Grid2016 · ▲229
Responsive & lightweight CSS grid for your website.
CSS Triggers2014 · ▲80
A game of layout, paint and composite

More dev tools this month

the category →

Dograh▲592
The open source VAPI alternative
Dev tools · 25d ago · dograh.com
Meridian▲530
Don't let your work go unnoticed. Get promoted!
Dev tools · 20d ago · meridiona.com
x1▲516
Lovable for iPhone apps go from idea to App Store
Dev tools · 11d ago · x1.new
The GTM Co-Founder▲402
Open-source GTM skills for technical founders
Dev tools · 29d ago · gtmcofounder.com
Open-Source eInk Bike Computer▲389
OpenTrailPaper is open-source bike computer firmware for the LilyGO T5S3 4.7" E-Paper PRO. It supports offline maps, GPX routes, FIT recording and Bluetooth sensors.
Dev tools · 1d ago · opentrailpaper.com
Nuphos▲380
The AI-Native DevOps Workspace.
Dev tools · 24d ago · nuphos.ai

Launched alongside, February 2014

the whole month →

Recordit▲564
A faster way to take screencasts Free + GIF Support
Life & fun · 2014
TJ
thedaywefightback.js▲472
Life & fun · 2014 · github.com
OneTab▲462
Save 95% memory by converting all your open tabs into a list
Work · 2014
Zapier▲433
Connect and automate 500+ web apps
Dev tools · 2014
JL
JS library to make your website instant▲426
http://instantclick.io/ It seems the internet architecture won't bring us instant websites anytime soon. So here is a hack. I released this JS library last month (today is version 2.0 release, fixing v1.0's rough edges), it makes use of HTML5's pushState and preloading to make a website instant. It works like this: before clicking on a link, you'll hover over it. And there's a delay of 200-300 ms between these two events. InstantClick uses this delay to preload a page, when you click on a link it will display instantly in most case. (You can test on the website.) That's…
Life & fun · 2014
IR
I redesigned the Microsoft employee badge▲322
Life & fun · 2014 · alp.im