This is a module!
Actually, this is the content div of a module
A module has two divs: a content div and a control div.
There's nothing to tag, just make two divs.
They're just the first and second div in a .module
By default, the content div
is 3 times wider than
the control div.
A .module.even-controls
divides the space evenly
The title bar displays the title attribute
of the .module. If the .module does not
have a title attribute, the title bar
does not appear
The colors of the panels are assigned to
CSS variables. Go ahead and change
them around, this style tag is editable!
Hold on! That module had two buttons! The
control div of each module has actually been
a div.buttons_v, aka a vertical button group.
You can add as many buttons as you want!
(click to reset)
You can also use .buttons_h to make a
horizontal button group. Changing your
.module to a .module.auto-controls lets
the content and control divs change their
width independantly. ()
Vertical and horizontal button
groups are great, and have the
advantage of adapting to any
amount of buttons automatically.
A .four_buttons must have four
buttons, but it organizes them
in a 2x2 pattern.
A .linebox places each childelement on its own line. Thechild elements can be anythingyou'd like, they'll probably work.These are pizza! Special, clickable,color changing pizza! The first andlast elements will match the border-radius of the .linebox.
Gridform
but it's
labels are
the items
don't have to be <input>'s
<h3> elements
are for
I wrote this css because i wanted
to build localhost web interfaces
rather than learning tkinter, but
they always turned out ugly. I
hope it can help you.
If you want the page to start fully
populated, the button to the right
is for you.