Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
The most densely packed CSS toolset you've ever seen
Branch: master

Fetching latest commit…

Cannot retrieve the latest commit at this time

Failed to load latest commit information.
README.md
fun.css
omega-maneuver.css

README.md

The Omega Maneuver

Originally conceived in response to a StackOverflow question that I found while searching for that particular answer for the hundredth time. The holy grail of CSS, fluid column widths with fixed margins. Dozens of frameworks have been built to solve this very need because heretofore there is no good one provided by CSS itself.

StackOverflow - CSS fluid columns, fixed margins; the holy grail of holy grails

Simplicity

I am never satisfied to use tools and frameworks that are imbued with a sense of heaviness. Especially with regards to html structure, I am a devout purist because of the tangible effect that clean code has when enlisting markup as a part of a more complicated application. Being bogged down in excessive markup and framework costs time at every step of the way from then on. It's an additional intellectual levy to pay every time you build something on top of it because it does not handle itself.

Self-documentation, The Thing is the Meaning, the Meaning is the Thing

.◤ {    top: 0;  left: 0; }
.◥ {    top: 0; right: 0; }
.◣ { bottom: 0;  left: 0; }
.◢ { bottom: 0; right: 0; }

<div class="◥"></div>

Infinitely Flexible Grids Without a Framework

When I approach building things I spend the great part of my effort figuring out how to cut things out or down or keep too much from getting in. For me, most CSS frameworks out there contain far more I'd strip out than I'd use, and ultimately the only thing I end up starting with is a streamlined html5 boilerplate, which has done a great job of packing in things to fix the environment, and not prescriptions for how I should build my projects.

The most valuable tools and pieces of code for me are those that densely pack both functionality and customizability with a thiftiness of implementation.

.▥4 { word-spacing: 40px; padding-right: 40px; }
.▥4>* { margin-right: -30px; width: 25%; }

<ul class="▥4">
  <li>Less markup</li>
  <li>Less css</li>
  <li>Less work</li>
  <li>Without needing a stack</li>
</div>

And two more lines of css to implement elegant fluid columns and fixed gutters.

Gridless grid

Something went wrong with that request. Please try again.