Template A12: MyDotComs
Research & Development

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