Hi,
I'm Mikey, Deep South Central USA. This is my 12th, a CSS template called "A12". Valid XHTML Transitional & CSS, and tested in typical browsers. Tuned, polished, works like a charm. Made the gradient background and canvas using Fireworks (for freeware use Gimp). Customize any way that you might like; no strings attached, yours.
Unique template, color schemes, menus, hover effects, nested divs, and borders. Flow and float positioning, fixed 775px width canvas frame, fairly simple and clearly coded. Please check out my other OSWD designs. Any questions or concerns, please contact me through the OSWD member tools. For you beginners out there, personalize this template with the best free wysiwyg html editor available, Nvu editor. Here's a very good Nvu Tutorial.
/**** Uses Nested divs, NO PAD/MARGIN, outer positioned, content centered,
inners get width:90% and all other styles, NO PAD/MARGIN *****/. This
one is a little different, the inner is float right to get away from
that canvas image. As to my layout technique: I had been doing this
here for a while, after hacking around with it, and even confirmed
a similar techinque here, from papab30. What I do, is to set outer
divs at nearly full width percentage, no pad, margin, or border,
strictly positioning, and leave a few percent for play when floating
outer columns; outer also styled for centered content (margin:0 auto
and text-align:center). I then insert an inner div, with width:90%;
which substitutes for margin/pad. It's just a hack, a resolution
for the IE/FF margin/pad problems. All further styling is done to
the inner, not the outer, and uses no pad/margin, period. Just drop
the content in, and it's liquid, and it's done. Just uses nested
centered divs instead of margin or pad, outer for positioning, inner
for color/border/style. Call this technique "Mikey's"
Mikey
PS: TomW asked me to drop a scrolling content div into this template,
just for a demonstration of how to insert wide objects which might
otherwise break the layout. Well, here's a div called table_container,
with width set at 200px height, width:100%; here goes:
"CLICK HERE"
s
s
s
s
s
s
s