Simpl.css v1.0 the simple css framework

Hey: I am finally getting around to doing updates for a final release Incorporating a baseline grid ~Shaggy


Forms

Personal Information
Medical History
Options
 
Current Medication

Are you currently taking any medication?

If so, please indicate it in the space below :

 

Tables

Table
Data Data Data
Data Data Data
Data Data Data
Data Data Data

Simpl but not simplistic

The idea here is simple, er, Simpl. If you need a cheatsheet for your framework it's broken. And in my world if you're not taking advantage of max-width go back to print design. And lastly if you have to calculate any pixels you're on the wrong track. With Simple.css You code the way you design. In regular divisions of the plane. If you want one column that takes up one third of the page and one column that takes up two thirds of the page you simply say ".ColumnOneThird" and ".ColumnTwoThirds" of course you'll probably want some ".Margin" I use margin instead of padding in case an old crappy version (aren't they all) of ie gets into quirks mode which it often does. Another reason to separate the margins from the column is to provide for equal margins regardless of whether you columns are nested or not. Pretty cool huh? Any questions, comments or donations contact me here.


Column OneHalf

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Column OneQuarter

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Column OneQuarter

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Top^


Column OneQuarter

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Column ThreeQuarters

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Top^